chore: shorten desktop live preview urls to project relative urls

src/extensionsIntegrated/Phoenix-live-preview/BrowserStaticServer.js

@@ -466,7 +466,7 @@ define(function (require, exports, module) {
                 console.error("Security issue prevented: Live preview tried to access non project resource!!!", path);
                 resolve({
                     path,
-                    contents: Strings.DESCRIPTION_LIVEDEV_SECURITY
+                    contents: null // 404. the user doesnt need to know this, might be a mistake too
                 });
                 return;
             }

src/extensionsIntegrated/Phoenix-live-preview/NodeStaticServer.js

@@ -158,8 +158,7 @@ define(function (require, exports, module) {
         // See if base url has been specified and path is within project
         if (relativePath !== path) {
             // Map to server url. Base url is already encoded, so don't encode again.
-
-            return `${baseUrl}${encodeURI(path)}`;
+            return `${baseUrl}/${encodeURI(relativePath)}`;
         }
 
         return null;
@@ -173,11 +172,19 @@ define(function (require, exports, module) {
      */
     StaticServer.prototype.urlToPath = function (url) {
         let baseUrl = this.getBaseUrl() || "";
+        const projectRoot = this.getProjectRoot();
 
         if (baseUrl !== "" && url.startsWith(baseUrl)) {
             const urlObj = new URL(url);
 
-            return decodeURI(urlObj.pathname);
+            let relativePath = decodeURI(urlObj.pathname);
+            if(relativePath.startsWith("/")){
+                // security: prevent path leak out of project when /path/../../../another folder/ is given
+                relativePath = path.normalize(relativePath);
+                // remove starting slash
+                relativePath = relativePath.slice(1);
+            }
+            return `${projectRoot}${relativePath}`;
         }
 
         return null;
@@ -517,18 +524,17 @@ define(function (require, exports, module) {
                     });
                 }
                 const projectRoot = ProjectManager.getProjectRoot().fullPath;
-                const projectRootUrl = `${_staticServerInstance.getBaseUrl()}${projectRoot}`;
                 let fullPath = currentFile.fullPath;
                 let httpFilePath = null;
                 if(fullPath.startsWith("http://") || fullPath.startsWith("https://")){
                     httpFilePath = fullPath;
                 }
                 if(utils.isPreviewableFile(fullPath)){
-                    const filePath = httpFilePath || path.relative(projectRoot, fullPath);
-                    let URL = httpFilePath || `${projectRootUrl}${filePath}`;
+                    const relativeFilePath = httpFilePath || path.relative(projectRoot, fullPath);
+                    let URL = httpFilePath || decodeURI(_staticServerInstance.pathToUrl(fullPath));
                     resolve({
                         URL,
-                        filePath: filePath,
+                        filePath: relativeFilePath,
                         fullPath: fullPath,
                         isMarkdownFile: utils.isMarkdownFile(fullPath),
                         isHTMLFile: utils.isHTMLFile(fullPath)

src/nls/root/strings.js

@@ -903,7 +903,6 @@ define({
     "DESCRIPTION_LIVEDEV_NO_PREVIEW_DETAILS": "Please select an HTML file to preview",
     "DESCRIPTION_LIVEDEV_MAIN_HEADING": "Uh Oh! <br>Your current browser doesn't support live preview.",
     "DESCRIPTION_LIVEDEV_MAIN_SPAN": "Get the best live preview experience by downloading our native apps for Windows, Mac, and Linux from <a href=\"https://phcode.io\" style=\"color: white\">phcode.io</a>.<br>",
-    "DESCRIPTION_LIVEDEV_SECURITY": "Security Warning from phcode.dev<br><br> This live preview attempted to access a non-project file. Access was denied for your safety. Please exercise caution when working on untrusted projects.",
     "DESCRIPTION_LIVEDEV_SECURITY_POPOUT_MESSAGE": "You are about to open a file for live preview. Please proceed only if you trust the source of this project. Click 'Trust Project' to continue, or close this window if you do not trust the source.",
     "DESCRIPTION_LIVEDEV_SECURITY_TRUST_MESSAGE": "You are about to open a file for live preview. Please proceed by clicking 'Trust Project' only if you trust the source of this project!",
     "TRUST_PROJECT": "Trust & Execute Preview - {0}",

test/spec/LiveDevelopment-MultiBrowser-test-files/exploit1.html

@@ -8,15 +8,10 @@
     async function fetchExternalProjectFile() {
         try{
             const response = await fetch("../movies.txt");
-            const txt = await response.text();
-            document.getElementById("status").innerText = txt;
-            document.fetchedText = txt;
-            // This is the error message to expect:
-            // Security Warning from phcode.dev<br><br> This live preview attempted to access a non-project file.
-            // Access was denied for your safety. Please exercise caution when working on untrusted projects.
+            document.responseStatus = response.status;
         } catch (e){
             console.error(e);
-            document.fetchedText = "ERRORED_OUT_TEST_SHOULD_FAIL_IF_REACHED_HERE";
+            document.responseStatus = "ERRORED_OUT_TEST_SHOULD_FAIL_IF_REACHED_HERE";
         }
     }
     fetchExternalProjectFile();

test/spec/LiveDevelopmentMultiBrowser-test.js

@@ -506,7 +506,7 @@ define(function (require, exports, module) {
 
             await awaits(300);
             let outerIFrame = testWindow.document.getElementById("panel-live-preview-frame");
-            expect(outerIFrame.src.endsWith("LiveDevelopment-MultiBrowser-test-files/readme.md")).toBeTrue();
+            expect(outerIFrame.src.endsWith("readme.md")).toBeTrue();
 
             // todo check hrefs in markdown. currently we do not have mechanism to exec code image and markdown previews
             // in future we should do this check too.
@@ -762,8 +762,8 @@ define(function (require, exports, module) {
                 "SpecRunnerUtils.openProjectFiles exploit1.html");
 
             await waitsForLiveDevelopmentToOpen();
-            await forRemoteExec(`document.fetchedText`, (result)=>{
-                return result && result.startsWith("Security Warning from phcode.dev<br><br>");
+            await forRemoteExec(`document.responseStatus`, (result)=>{
+                return result === 404;
             });
 
             await endPreviewSession();