[users/chhol/convert-karma-tests-to-web-test-runner] Upgrade Playwright to ^1.39.0

.github/workflows/ci-validate-platforms.yml

@@ -64,9 +64,7 @@ jobs:
         run: yarn prepare
 
       - name: Install playwright dependencies and browsers
-        run: |
-          yarn playwright install-deps
-          yarn playwright install
+        run: npx playwright install --with-deps
 
       - name: Run tests in changed packages
         if: ${{ github.event_name == 'pull_request' }}

.github/workflows/ci-validate-pr.yml

@@ -51,9 +51,7 @@ jobs:
       run: yarn prepare
 
     - name: Install playwright dependencies and browsers
-      run: |
-        yarn playwright install-deps
-        yarn playwright install
+      run: npx playwright install --with-deps
 
     - name: Testing unit tests
       run: yarn lerna run test --stream

change/@microsoft-fast-colors-2e75979a-6bc6-4463-ae4d-0739638fa981.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "update to use web test runner",
+  "packageName": "@microsoft/fast-colors",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

change/@microsoft-fast-element-f069a730-f321-4638-b391-9977ac476604.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "update to use web test runner",
+  "packageName": "@microsoft/fast-element",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

change/@microsoft-fast-foundation-d5fd6847-720e-4748-a95a-d6f4df9d37ba.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "update to use web test runner",
+  "packageName": "@microsoft/fast-foundation",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

change/@microsoft-fast-react-wrapper-ff95291f-c473-43f6-852f-6ba3a98d590f.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "update to use web test runner",
+  "packageName": "@microsoft/fast-react-wrapper",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

change/@microsoft-fast-router-0f32d115-9466-4195-90b0-b463a5714429.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "update to use web test runner",
+  "packageName": "@microsoft/fast-router",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

change/@microsoft-fast-ssr-f080a9c4-e146-4fe1-be11-ea9dab328662.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "update playwright version",
+  "packageName": "@microsoft/fast-ssr",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

change/@microsoft-fast-web-utilities-14b2f190-1571-4498-ba72-68bbafb26a20.json → change/@microsoft-fast-web-utilities-3092275f-0c7e-4bf4-be96-424047357621.json

@@ -1,6 +1,6 @@
 {
   "type": "none",
-  "comment": "fix RtlScrollConverter test for high dpi systems",
+  "comment": "fix RtlScrollConverter test",
   "packageName": "@microsoft/fast-web-utilities",
   "email": "[email protected]",
   "dependentChangeType": "none"

change/@microsoft-fast-web-utilities-7faf962a-1974-474e-a3c2-f4ec64177eab.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "update to use web test runner",
+  "packageName": "@microsoft/fast-web-utilities",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

package.json

@@ -18,9 +18,6 @@
       "examples/ssr"
     ],
     "nohoist": [
-      "**/@types/chai",
-      "**/@types/jest",
-      "**/@types/karma",
       "**/@types/mocha",
       "**/@types/node",
       "**/chai",

packages/utilities/fast-colors/package.json

@@ -37,9 +37,8 @@
     "watch": "yarn build -- -w --preserveWatchOutput"
   },
   "devDependencies": {
-    "@types/chai": "^4.2.11",
+    "@esm-bundle/chai": "4.3.4-fix.0",
     "@types/mocha": "^8.2.0",
-    "chai": "^4.2.0",
     "mocha": "^8.2.1",
     "@microsoft/eslint-config-fast-dna": "^2.1.0",
     "eslint-config-prettier": "^8.8.0",

packages/utilities/fast-colors/src/color-blending.spec.ts

@@ -1,4 +1,4 @@
-import chai from "chai";
+import { expect } from "@esm-bundle/chai";
 import { test } from "mocha";
 import { testData } from "./__test__/testData.js";
 import {
@@ -16,7 +16,7 @@ import {
     lightenViaLAB,
     saturateViaLCH,
 } from "./index.js";
-const expect = chai.expect;
+
 const testPrecision: number = 4;
 
 describe("Color blending functions", () => {

packages/utilities/fast-colors/src/color-converters.spec.ts

@@ -1,4 +1,4 @@
-import chai from "chai";
+import { expect } from "@esm-bundle/chai";
 import { test } from "mocha";
 import { testData } from "./__test__/testData.js";
 import {
@@ -28,7 +28,6 @@ import {
     xyzToLAB,
     xyzToRGB,
 } from "./index.js";
-const expect = chai.expect;
 
 const testPrecision: number = 4;
 

packages/utilities/fast-colors/src/color-palette.spec.ts

@@ -1,4 +1,4 @@
-import chai from "chai";
+import { expect } from "@esm-bundle/chai";
 import { test } from "mocha";
 import { testData } from "./__test__/testData.js";
 import {
@@ -9,7 +9,6 @@ import {
 } from "./color-palette.js";
 import { ColorRGBA64 } from "./color-rgba-64.js";
 import { parseColorHexRGB } from "./parse-color.js";
-const expect = chai.expect;
 
 const testPrecision: number = 4;
 

packages/utilities/fast-colors/src/color-quantization.spec.ts

@@ -1,10 +1,9 @@
-import chai from "chai";
+import { expect } from "@esm-bundle/chai";
 import { test } from "mocha";
 import { test200ImageData } from "./__test__/test200.js";
 import { testGrey200ImageData } from "./__test__/testGrey200.js";
 import { ArrayPixelBlob } from "./array-pixel-blob.js";
 import { quantize, QuantizedColor } from "./color-quantization.js";
-const expect = chai.expect;
 
 describe("Generating a histogram from an image", (): void => {
     test("quantize with default settings", () => {

packages/utilities/fast-colors/src/histogram.spec.ts

@@ -1,9 +1,8 @@
-import chai from "chai";
+import { expect } from "@esm-bundle/chai";
 import { test } from "mocha";
 import { test200ImageData } from "./__test__/test200.js";
 import { Histogram } from "./histogram.js";
 import { ArrayPixelBlob } from "./array-pixel-blob.js";
-const expect = chai.expect;
 
 describe("Generating a histogram from an image", (): void => {
     test("getHistogramIndex", () => {

packages/utilities/fast-colors/src/palette-extractor.spec.ts

@@ -1,11 +1,10 @@
-import chai from "chai";
+import { expect } from "@esm-bundle/chai";
 import { test } from "mocha";
 import { test200ImageData } from "./__test__/test200.js";
 import { testGrey200ImageData } from "./__test__/testGrey200.js";
 import { ArrayPixelBlob } from "./array-pixel-blob.js";
 import { quantize, QuantizedColor } from "./color-quantization.js";
 import { extractPalette, PaletteEntry } from "./palette-extractor.js";
-const expect = chai.expect;
 
 describe("Extracting a palette from a set of colors", (): void => {
     test("Extract palette with default settings", () => {

packages/utilities/fast-colors/src/parse-color.spec.ts

@@ -1,4 +1,4 @@
-import chai from "chai";
+import { expect } from "@esm-bundle/chai";
 import { test } from "mocha";
 import { testData } from "./__test__/testData.js";
 import {
@@ -16,7 +16,6 @@ import {
     parseColorWebRGB,
     parseColorWebRGBA,
 } from "./index.js";
-const expect = chai.expect;
 
 const testPrecision: number = 4;
 const hexDigits: string[] = [