ci: add macos firefox/chrome test suite run with playwright

.github/workflows/playwright-chromium-linux.yml

@@ -1,4 +1,4 @@
-name: Playwright-Chromium-linux run full tests suite
+name: Chromium-linux run full tests suite
 on:
   pull_request:
     branches: [ main ]

.github/workflows/playwright-chromium-macos.yml

@@ -0,0 +1,51 @@
+name: Chromium-macos run full tests suite
+on:
+  pull_request:
+    branches: [ main ]
+jobs:
+  playwright-chromium-macos:
+    timeout-minutes: 90
+    runs-on: macos-latest
+    steps:
+    - uses: actions/checkout@v3
+    - name: Install dependencies
+      run: npm ci
+    - name: Build phoenix
+      run: npm run build
+    - name: Install Playwright Browsers
+      run: npx playwright install --with-deps
+
+    - name: Run Playwright unit tests in Chromium
+      uses: nick-fields/retry@v2
+      with:
+        timeout_minutes: 12
+        max_attempts: 3
+        command: npm run testChromium
+
+    - name: Run Playwright integration tests in Chromium
+      uses: nick-fields/retry@v2
+      with:
+        timeout_minutes: 12
+        max_attempts: 3
+        command: npx cross-env TEST_ENV=integration npm run testChromium
+
+    - name: Run Playwright mainview tests in Chromium
+      uses: nick-fields/retry@v2
+      with:
+        timeout_minutes: 12
+        max_attempts: 3
+        command: npx cross-env TEST_ENV=mainview npm run testChromium
+
+    - name: Run Playwright livepreview tests in Chromium
+      uses: nick-fields/retry@v2
+      with:
+        timeout_minutes: 15
+        max_attempts: 3
+        command: npx cross-env TEST_ENV=livepreview npm run testChromium
+
+    - name: Run Playwright LegacyInteg tests in Chromium
+      uses: nick-fields/retry@v2
+      with:
+        timeout_minutes: 20
+        max_attempts: 3
+        command: npx cross-env TEST_ENV=LegacyInteg npm run testChromium

.github/workflows/playwright-chromium-windows.yml

@@ -1,4 +1,4 @@
-name: Playwright-Chromium-windows run full tests suite
+name: Chromium-windows run full tests suite
 on:
   pull_request:
     branches: [ main ]

.github/workflows/playwright-firefox-linux.yml

@@ -1,4 +1,4 @@
-name: Playwright-Firefox-linux run full tests suite
+name: Firefox-linux run full tests suite
 on:
   pull_request:
     branches: [ main ]

.github/workflows/playwright-firefox-macos.yml

@@ -0,0 +1,51 @@
+name: Firefox-macos run full tests suite
+on:
+  pull_request:
+    branches: [ main ]
+jobs:
+  playwright-firefox-macos:
+    timeout-minutes: 90
+    runs-on: macos-latest
+    steps:
+    - uses: actions/checkout@v3
+    - name: Install dependencies
+      run: npm ci
+    - name: Build phoenix
+      run: npm run build
+    - name: Install Playwright Browsers
+      run: npx playwright install --with-deps
+
+    - name: Run Playwright unit tests in Firefox
+      uses: nick-fields/retry@v2
+      with:
+        timeout_minutes: 12
+        max_attempts: 3
+        command: npm run testFirefox
+
+    - name: Run Playwright integration tests in Firefox
+      uses: nick-fields/retry@v2
+      with:
+        timeout_minutes: 12
+        max_attempts: 3
+        command: npx cross-env TEST_ENV=integration npm run testFirefox
+
+    - name: Run Playwright mainview tests in Firefox
+      uses: nick-fields/retry@v2
+      with:
+        timeout_minutes: 12
+        max_attempts: 3
+        command: npx cross-env TEST_ENV=mainview npm run testFirefox
+
+    - name: Run Playwright livepreview tests in Firefox
+      uses: nick-fields/retry@v2
+      with:
+        timeout_minutes: 15
+        max_attempts: 3
+        command: npx cross-env TEST_ENV=livepreview npm run testFirefox
+
+    - name: Run Playwright LegacyInteg tests in Firefox
+      uses: nick-fields/retry@v2
+      with:
+        timeout_minutes: 20
+        max_attempts: 3
+        command: npx cross-env TEST_ENV=LegacyInteg npm run testFirefox

.github/workflows/playwright-firefox-windows.yml

@@ -1,4 +1,4 @@
-name: Playwright-Firefox-windows run full tests suite
+name: Firefox-windows run full tests suite
 on:
   pull_request:
     branches: [ main ]

.github/workflows/playwright-on-push-main.yml

@@ -107,6 +107,53 @@ jobs:
           max_attempts: 3
           command: npx cross-env TEST_ENV=LegacyInteg npm run testChromiumDist
 
+  playwrightChromiumMacos:
+    timeout-minutes: 90
+    runs-on: macos-latest
+    steps:
+      - uses: actions/checkout@v3
+      - name: Install dependencies
+        run: npm ci
+      - name: Build phoenix
+        run: npm run build
+      - name: Install Playwright Browsers
+        run: npx playwright install --with-deps
+
+      - name: Run Playwright unit tests in Chromium
+        uses: nick-fields/retry@v2
+        with:
+          timeout_minutes: 12
+          max_attempts: 3
+          command: npm run testChromium
+
+      - name: Run Playwright integration tests in Chromium
+        uses: nick-fields/retry@v2
+        with:
+          timeout_minutes: 12
+          max_attempts: 3
+          command: npx cross-env TEST_ENV=integration npm run testChromium
+
+      - name: Run Playwright mainview tests in Chromium
+        uses: nick-fields/retry@v2
+        with:
+          timeout_minutes: 12
+          max_attempts: 3
+          command: npx cross-env TEST_ENV=mainview npm run testChromium
+
+      - name: Run Playwright livepreview tests in Chromium
+        uses: nick-fields/retry@v2
+        with:
+          timeout_minutes: 15
+          max_attempts: 3
+          command: npx cross-env TEST_ENV=livepreview npm run testChromium
+
+      - name: Run Playwright LegacyInteg tests in Chromium
+        uses: nick-fields/retry@v2
+        with:
+          timeout_minutes: 20
+          max_attempts: 3
+          command: npx cross-env TEST_ENV=LegacyInteg npm run testChromium
+
   playwrightFirefoxLinux:
     timeout-minutes: 90
     runs-on: ubuntu-latest
@@ -205,17 +252,66 @@ jobs:
           max_attempts: 3
           command: npx cross-env TEST_ENV=LegacyInteg npm run testFirefoxDist
 
+  playwrightFirefoxMacos:
+    timeout-minutes: 90
+    runs-on: macos-latest
+    steps:
+      - uses: actions/checkout@v3
+      - name: Install dependencies
+        run: npm ci
+      - name: Build phoenix
+        run: npm run build
+      - name: Install Playwright Browsers
+        run: npx playwright install --with-deps
+
+      - name: Run Playwright unit tests in Firefox
+        uses: nick-fields/retry@v2
+        with:
+          timeout_minutes: 12
+          max_attempts: 3
+          command: npm run testFirefox
+
+      - name: Run Playwright integration tests in Firefox
+        uses: nick-fields/retry@v2
+        with:
+          timeout_minutes: 12
+          max_attempts: 3
+          command: npx cross-env TEST_ENV=integration npm run testFirefox
+
+      - name: Run Playwright mainview tests in Firefox
+        uses: nick-fields/retry@v2
+        with:
+          timeout_minutes: 12
+          max_attempts: 3
+          command: npx cross-env TEST_ENV=mainview npm run testFirefox
+
+      - name: Run Playwright livepreview tests in Firefox
+        uses: nick-fields/retry@v2
+        with:
+          timeout_minutes: 15
+          max_attempts: 3
+          command: npx cross-env TEST_ENV=livepreview npm run testFirefox
+
+      - name: Run Playwright LegacyInteg tests in Firefox
+        uses: nick-fields/retry@v2
+        with:
+          timeout_minutes: 20
+          max_attempts: 3
+          command: npx cross-env TEST_ENV=LegacyInteg npm run testFirefox
+
   raiseIssue:
-    needs: [ playwrightChromiumLinux, playwrightChromiumWindows, playwrightFirefoxLinux, playwrightFirefoxWindows]
+    needs: [ playwrightChromiumLinux, playwrightChromiumWindows, playwrightChromiumMacos, playwrightFirefoxLinux, playwrightFirefoxWindows, playwrightFirefoxMacos]
     runs-on: ubuntu-latest
     if: always() # This ensures that this job runs even if the previous jobs failed
     steps:
       - name: Check for failures and raise an issue
         if: |
           needs.playwrightChromiumLinux.result == 'failure' || 
           needs.playwrightChromiumWindows.result == 'failure' ||
+          needs.playwrightChromiumMacos.result == 'failure' ||
           needs.playwrightFirefoxLinux.result == 'failure' || 
-          needs.playwrightFirefoxWindows.result == 'failure'
+          needs.playwrightFirefoxWindows.result == 'failure' ||
+          needs.playwrightFirefoxMacos.result == 'failure'
         uses: actions/github-script@v5
         with:
           github-token: ${{secrets.GITHUB_TOKEN}}
@@ -230,12 +326,18 @@ jobs:
             if (needs.playwrightChromiumWindows.result == 'failure') {
               issueBody += " - Chromium windows tests failed.\n";
             }
+            if (needs.playwrightChromiumMacos.result == 'failure') {
+              issueBody += " - Chromium MacOS tests failed.\n";
+            }
             if (needs.playwrightFirefoxLinux.result == 'failure') {
               issueBody += " - Firefox linux tests failed.\n";
             }
             if (needs.playwrightFirefoxWindows.result == 'failure') {
               issueBody += " - Firefox Windows tests failed.\n";
             }
+            if (needs.playwrightFirefoxMacos.result == 'failure') {
+              issueBody += " - Firefox MacOS tests failed.\n";
+            }
 
             github.rest.issues.create({
               owner: context.repo.owner,

src/styles/brackets_patterns_override.less

@@ -1439,7 +1439,7 @@ a[href^="http"] {
             }
             .ext-info {
                 padding-left: 15px;
-                width: 220px;
+                max-width: 300px;
             }
             .ext-name {
                 color: @bc-text;
@@ -1454,8 +1454,7 @@ a[href^="http"] {
                 }
             }
             .ext-desc {
-                width: auto;
-                max-width: 350px;
+                max-width: 275px;
                 color: @bc-text;
                 font-weight: normal;
                 .user-select(text);
@@ -1465,6 +1464,13 @@ a[href^="http"] {
                     color: @dark-bc-text;
                 }
             }
+            .ext-full-description {
+                width: 100% !important;
+                max-height: 50px; /* Adjust based on your requirements */
+                overflow: hidden;
+                display: block; /* To make sure the width and max-height are respected */
+                white-space: nowrap; /* If you want to prevent wrapping, can be removed otherwise */
+            }
             .ext-translated,
             .muted {
                 color: @bc-text-thin-quiet;

test/UnitTestReporter.js

@@ -80,6 +80,24 @@ define(function (require, exports, module) {
         }, WAIT_TIME_TO_COMPLETE_TEST_LOGGING_SEC * 1000);
     }
 
+    function formatMilliseconds(ms) {
+        const hours = Math.floor(ms / (1000 * 60 * 60));
+        const minutes = Math.floor((ms % (1000 * 60 * 60)) / (1000 * 60));
+        const seconds = Math.floor((ms % (1000 * 60)) / 1000);
+
+        let result = '';
+
+        if (hours) {
+            result = result + `${hours}-Hr `;
+        }
+        if (minutes) {
+            result = result + `${minutes}-Min `;
+        }
+        result = `${result}${seconds}-Sec`;
+
+        return result.trim();
+    }
+
     /**
      * @constructor
      * Creates a UnitTestReporter object. This has a number public properties:
@@ -245,7 +263,7 @@ define(function (require, exports, module) {
                 if (self.specFilter(self.suiteIdToSuiteMap[result.id])) {
                     console.log('Suite: ' + result.description + ' [status]: ' + result.status);
                     if(result.status !== 'passed'){
-                        globalTestRunnerLogToConsole(`\u2716 Suite failed!! ${result.description} (after ${result.duration} ms)`);
+                        globalTestRunnerLogToConsole(`\u2716 Suite failed!! ${result.description} (after ${formatMilliseconds(result.duration)})`);
                     }
                 }
                 self.reportSuiteResults(result);
@@ -255,7 +273,7 @@ define(function (require, exports, module) {
                 console.log('Finished jasmine: ' + result.overallStatus);
                 globalTestRunnerLogToConsole('Finished jasmine: ' + result.overallStatus);
                 if(self.totalFailedCount === 0){
-                    globalTestRunnerLogToConsole(`\u2714 All(${self.totalSpecCount}) tests passed. (in ${result.totalTime}ms)`);
+                    globalTestRunnerLogToConsole(`\u2714 All(${self.totalSpecCount}) tests passed. (in ${formatMilliseconds(result.totalTime)})`);
                     if(result.overallStatus !== 'passed') {
                         window.externalJasmineFailures = true;
                         globalTestRunnerErrorToConsole(`\u2716 Some suites was detected to have failures outside of the suite tests. This could indicate an underlying problem. please run tests locally to debug.`);
@@ -276,7 +294,7 @@ define(function (require, exports, module) {
                         quitIfNeeded(0);
                     }
                 } else {
-                    globalTestRunnerErrorToConsole(`\u2716 ${self.totalFailedCount} of ${self.totalSpecCount} tests Failed, ${self.totalPassedCount} passed. (in ${result.totalTime}ms)`);
+                    globalTestRunnerErrorToConsole(`\u2716 ${self.totalFailedCount} of ${self.totalSpecCount} tests Failed, ${self.totalPassedCount} passed. (in ${formatMilliseconds(result.totalTime)})`);
                     quitIfNeeded(1);
                 }
                 self.reportRunnerResults(result);