test: custom server live preview banner integ test

Author: abose

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

@@ -105,7 +105,10 @@ define(function (require, exports, module) {
 
     function _saveProjectPreferences(useCustomServer, liveServerURL, serveRoot, hotReloadSupported, framework) {
         PreferencesManager.set(PREFERENCE_PROJECT_SERVER_ENABLED, useCustomServer, PreferencesManager.PROJECT_SCOPE);
-        PreferencesManager.set(PREFERENCE_PROJECT_SERVER_URL, liveServerURL, PreferencesManager.PROJECT_SCOPE);
+        if(PreferencesManager.get(PREFERENCE_PROJECT_SERVER_URL, PreferencesManager.PROJECT_SCOPE) !== liveServerURL){
+            // we check for change as a change event handler is attached to this property
+            PreferencesManager.set(PREFERENCE_PROJECT_SERVER_URL, liveServerURL, PreferencesManager.PROJECT_SCOPE);
+        }
         PreferencesManager.set(PREFERENCE_PROJECT_SERVER_PATH, serveRoot, PreferencesManager.PROJECT_SCOPE);
         PreferencesManager.set(PREFERENCE_PROJECT_SERVER_HOT_RELOAD_SUPPORTED, hotReloadSupported, PreferencesManager.PROJECT_SCOPE);
         PreferencesManager.set(PREFERENCE_PROJECT_PREVIEW_FRAMEWORK, framework, PreferencesManager.PROJECT_SCOPE);

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

@@ -791,6 +791,7 @@ define(function (require, exports, module) {
             refreshPreview();
         });
         LivePreviewSettings.on(LivePreviewSettings.EVENT_SERVER_CHANGED, ()=>{
+            customLivePreviewBannerShown = false;
             refreshPreview();
             _customServerMetrics();
         });

test/spec/LiveDevelopmentCustomServer-test.js

@@ -661,6 +661,11 @@ define(function (require, exports, module) {
                 return testWindow.$(".live-preview-custom-banner").is(":visible");
             }, "banner to show");
 
+            // now open the settings dialog
+            testWindow.$(".live-preview-settings-banner-btn").click();
+            await SpecRunnerUtils.waitForModalDialog();
+            SpecRunnerUtils.clickDialogButton(Dialogs.DIALOG_BTN_CANCEL);
+
             testWindow.$(".custom-server-banner-close-icon").click();
             expect(testWindow.$(".live-preview-custom-banner").is(":visible")).toBe(false);
 
@@ -669,7 +674,7 @@ define(function (require, exports, module) {
                 "open sub.html");
             await _waitForIframeMDFile('readme.md');
 
-            // switch to html file
+            // switch to html file, should not show banner after dismiss
             await awaitsForDone(SpecRunnerUtils.openProjectFiles(["sub/sub.html"]),
                 "open sub.html");
             await _waitForIframeURL('http://localhost:43768/sub.html');
@@ -678,6 +683,39 @@ define(function (require, exports, module) {
             await endPreviewSession();
         }, 30000);
 
+        it("should custom server banner come back on changing live preview settings", async function () {
+            await _setupSimpleProject("sub/", false);
+
+            await awaitsForDone(SpecRunnerUtils.openProjectFiles(["sub/sub.html"]),
+                "open sub.html");
+
+            await awaitsFor(()=>{
+                return testWindow.$(".live-preview-custom-banner").is(":visible");
+            }, "banner to show");
+
+            testWindow.$(".custom-server-banner-close-icon").click();
+            expect(testWindow.$(".live-preview-custom-banner").is(":visible")).toBe(false);
+
+            // now change the server
+            PreferencesManager.set(PREFERENCE_PROJECT_SERVER_URL, "http://another.server:43768",
+                PreferencesManager.PROJECT_SCOPE);
+
+            // now switch to readme file
+            await awaitsForDone(SpecRunnerUtils.openProjectFiles(["readme.md"]),
+                "open sub.html");
+            await _waitForIframeMDFile('readme.md');
+
+            // switch to html file, should show banner again as server changed
+            await awaitsForDone(SpecRunnerUtils.openProjectFiles(["sub/sub.html"]),
+                "open sub.html");
+
+            await awaitsFor(()=>{
+                return testWindow.$(".live-preview-custom-banner").is(":visible");
+            }, "banner to show");
+
+            await endPreviewSession();
+        }, 30000);
+
         async function _forSVGLivePreview() {
             await awaitsFor(()=>{
                 let iFrame = testWindow.document.getElementById("panel-live-preview-frame");