solution

.github/workflows/.gitignore

@@ -0,0 +1,4 @@
+node_modules/
+/test-results/
+/playwright-report/
+/playwright/.cache/

.github/workflows/main.yml

@@ -0,0 +1,39 @@
+name: JobSimulator.dev Test Checker
+
+on:
+  push:
+    branches: ["main"]
+  pull_request:
+    branches: ["main"]
+
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
+defaults:
+  run:
+    shell: bash
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    container:
+      image: mcr.microsoft.com/playwright:v1.31.0-focal
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18
+      - name: Install dependencies
+        run: npm ci && cd .github/workflows && npm ci && cd ../..
+
+      - name: build app
+        run: npx webpack
+
+      - name: start webpack server
+        run: npx webpack serve &
+
+      - name: start backend
+        run: npm run start-json-server &
+
+      - name: Run Tests
+        run: node .github/workflows/test.js

.github/workflows/package.json

@@ -0,0 +1,8 @@
+{
+  "type": "module",
+  "devDependencies": {
+    "playwright": "^1.31.1",
+    "uvu": "^0.5.6"
+  },
+  "scripts": {}
+}

.github/workflows/test.js

@@ -0,0 +1,96 @@
+import { chromium } from "playwright";
+import { setTimeout } from "timers/promises";
+import { test } from "uvu";
+import * as assert from "uvu/assert";
+
+let browser;
+let context;
+let page;
+
+test.before(async () => {
+  browser = await chromium.launch({
+    use: { timezoneId: "Etc/UTC" },
+  });
+  context = await browser.newContext();
+});
+
+test.before.each(async () => {
+  page = await context.newPage();
+});
+
+test.after.each(async () => {
+  await page.close();
+});
+
+test.after(async () => {
+  await browser.close();
+  await context.close();
+});
+
+test("Solved Issue #1: Company Names are Present", async () => {
+  await page.goto("http://localhost:8080");
+  await setTimeout(250);
+
+  var text = await page.$eval("body > table > tbody > tr:nth-child(2) > td:nth-child(1)", (el) => el.textContent);
+  assert.type(text, "string");
+  assert.is(text, "Fusion LLC");
+
+  var text = await page.$eval("body > table > tbody > tr:nth-child(3) > td:nth-child(1)", (el) => el.textContent);
+  assert.type(text, "string");
+  assert.is(text, "Techopolis Ltd.");
+
+  var text = await page.$eval("body > table > tbody > tr:nth-child(4) > td:nth-child(1)", (el) => el.textContent);
+  assert.type(text, "string");
+  assert.is(text, "Code learning LLC");
+});
+
+test("Solved Issue #2: display dates in 24-hour time format", async () => {
+  await page.goto("http://localhost:8080");
+  await setTimeout(250);
+
+  var text = await page.$eval("body > table > tbody > tr:nth-child(2) > td:nth-child(3)", (el) => el.textContent);
+  assert.type(text, "string");
+  assert.is(text, "03:41");
+
+  var text = await page.$eval("body > table > tbody > tr:nth-child(3) > td:nth-child(3)", (el) => el.textContent);
+  assert.type(text, "string");
+  assert.is(text, "08:45");
+
+  var text = await page.$eval("body > table > tbody > tr:nth-child(4) > td:nth-child(3)", (el) => el.textContent);
+  assert.type(text, "string");
+  assert.is(text, "12:45");
+});
+
+test("Solved Issue #3: display revenue numbers in a human readable format", async () => {
+  await page.goto("http://localhost:8080");
+  await setTimeout(250);
+
+  var text = await page.$eval("body > table > tbody > tr:nth-child(2) > td:nth-child(4)", (el) => el.textContent);
+  assert.type(text, "string");
+  assert.is(text, "17 000 000");
+
+  var text = await page.$eval("body > table > tbody > tr:nth-child(3) > td:nth-child(4)", (el) => el.textContent);
+  assert.type(text, "string");
+  assert.is(text, "7 375 294");
+
+  var text = await page.$eval("body > table > tbody > tr:nth-child(4) > td:nth-child(4)", (el) => el.textContent);
+  assert.type(text, "string");
+  assert.is(text, "100 000");
+});
+
+test("Solved Issue #4: make table look prettier", async () => {
+  await page.goto("http://localhost:8080");
+  await setTimeout(250);
+
+  var headerColor = await page.$eval("tr:first-of-type", (el) =>
+    getComputedStyle(el).getPropertyValue("background-color")
+  );
+  assert.is(headerColor, "rgb(173, 216, 230)");
+
+  var tableBorderColor = await page.$eval("body > table", (el) =>
+    getComputedStyle(el).getPropertyValue("border-color")
+  );
+  assert.is(tableBorderColor, "rgb(173, 216, 230)");
+});
+
+test.run();

.gitignore

@@ -59,7 +59,7 @@ yarn-error.log*
 
 
 # Dependency directories
-node_modules/
+**node_modules**
 jspm_packages/
 
 # Optional npm cache directory