Add more unit tests (#311)

Author: Eric-Arellano

package.json

@@ -9,7 +9,7 @@
     "check": "tsc --noEmit",
     "fmt": "prettier --write .",
     "fix": "prettier --write packages/; eslint --fix packages/",
-    "lint": "prettier --check . && eslint packages/"
+    "lint": "eslint packages/ && prettier --check ."
   },
   "devDependencies": {
     "@parcel/compressor-brotli": "~2.12.0",

packages/ct/src/js/scorecard.ts

@@ -2,8 +2,9 @@ import {
   ScorecardValues,
   formatHeader,
   formatReformLine,
-} from "@prn-parking-lots/shared/src/js/city-ui/scorecard";
-import type { CityStats } from "./types";
+} from "@prn-parking-lots/shared/src/js/city-ui/scorecard.ts";
+
+import type { CityStats } from "./types.ts";
 
 export default function formatScorecard(stats: CityStats): ScorecardValues {
   const header = formatHeader({

packages/ct/tests/dropdownGroups.test.ts

@@ -0,0 +1,31 @@
+import { expect, test } from "@playwright/test";
+
+import createDropdownGroups from "../src/js/dropdownGroups";
+
+test("createDropdownGroups", () => {
+  const common = {
+    percentage: "",
+    population: "",
+    reforms: "",
+    url: null,
+  };
+  const input = {
+    city1: {
+      ...common,
+      name: "City 1",
+    },
+    city2: {
+      ...common,
+      name: "City 2",
+    },
+  };
+  expect(createDropdownGroups(input)).toEqual([
+    {
+      label: "Group 1",
+      cities: [
+        { id: "city1", name: "City 1" },
+        { id: "city2", name: "City 2" },
+      ],
+    },
+  ]);
+});

packages/ct/tests/main.test.ts packages/ct/tests/integration.test.tspackages/ct/tests/main.test.ts renamed to packages/ct/tests/integration.test.ts

@@ -0,0 +1,32 @@
+import { expect, test } from "@playwright/test";
+
+import { formatReformLine } from "@prn-parking-lots/shared/src/js/city-ui/scorecard.ts";
+
+import formatScorecard from "../src/js/scorecard.ts";
+
+test.describe("formatScorecard", () => {
+  test("full stats", () => {
+    const { listEntries } = formatScorecard({
+      name: "Hartford - rail station",
+      percentage: "25%",
+      population: "42,412",
+      reforms: "adopted",
+      url: "https://parkingreform.org",
+    });
+    expect(listEntries).toEqual([
+      "42,412 city residents",
+      formatReformLine("adopted", "https://parkingreform.org"),
+    ]);
+  });
+
+  test("minimum stats", () => {
+    const { listEntries } = formatScorecard({
+      name: "Hartford - rail station",
+      percentage: "25%",
+      population: "42,412",
+      reforms: null,
+      url: null,
+    });
+    expect(listEntries).toEqual(["42,412 city residents"]);
+  });
+});

packages/ct/tests/scorecard.test.ts

@@ -2,8 +2,14 @@ import {
   ScorecardValues,
   formatHeader,
   formatReformLine,
-} from "@prn-parking-lots/shared/src/js/city-ui/scorecard";
-import type { CityStats } from "./types";
+} from "@prn-parking-lots/shared/src/js/city-ui/scorecard.ts";
+
+import type { CityStats } from "./types.ts";
+
+export const COMMUNITY_WARNING = `<div class="community-contribution-warning">
+    <i class="fa-solid fa-triangle-exclamation" aria-hidden="true"></i> 
+    Community-maintained map
+  </div>`;
 
 export default function formatScorecard(stats: CityStats): ScorecardValues {
   let header = formatHeader({
@@ -12,10 +18,7 @@ export default function formatScorecard(stats: CityStats): ScorecardValues {
     boundaryDescription: "central city",
   });
   if (stats.contribution) {
-    header += `<div class="community-contribution-warning">
-    <i class="fa-solid fa-triangle-exclamation" aria-hidden="true"></i> 
-    Community-maintained map
-  </div>`;
+    header += COMMUNITY_WARNING;
   }
 
   const listEntries = [];

packages/primary/src/js/scorecard.ts

@@ -0,0 +1,65 @@
+import { expect, test } from "@playwright/test";
+
+import {
+  formatHeader,
+  formatReformLine,
+} from "@prn-parking-lots/shared/src/js/city-ui/scorecard.ts";
+
+import formatScorecard, { COMMUNITY_WARNING } from "../src/js/scorecard.ts";
+
+test.describe("formatScorecard", () => {
+  test("full stats", () => {
+    const { header, listEntries } = formatScorecard({
+      name: "Hartford, CT",
+      percentage: "25%",
+      population: "42,412",
+      reforms: "adopted",
+      url: "https://parkingreform.org",
+      cityType: "suburb",
+      urbanizedAreaPopulation: "104,241",
+      parkingScore: "88",
+      contribution: "email@parkingreform.org",
+    });
+    expect(header).toEqual(
+      formatHeader({
+        name: "Hartford, CT",
+        percentage: "25%",
+        boundaryDescription: "central city",
+      }) + COMMUNITY_WARNING,
+    );
+    expect(listEntries).toEqual([
+      "88/100 parking score (lower is better)",
+      "City type: suburb",
+      "42,412 city residents",
+      "104,241 urbanized area residents",
+      formatReformLine("adopted", "https://parkingreform.org"),
+      `<a href="mailto:email@parkingreform.org">Email data maintainer</a>`,
+    ]);
+  });
+
+  test("minimal stats", () => {
+    const { header, listEntries } = formatScorecard({
+      name: "Hartford, CT",
+      percentage: "25%",
+      population: "42,412",
+      reforms: null,
+      url: null,
+      cityType: "suburb",
+      urbanizedAreaPopulation: "104,241",
+      parkingScore: null,
+      contribution: null,
+    });
+    expect(header).toEqual(
+      formatHeader({
+        name: "Hartford, CT",
+        percentage: "25%",
+        boundaryDescription: "central city",
+      }),
+    );
+    expect(listEntries).toEqual([
+      "City type: suburb",
+      "42,412 city residents",
+      "104,241 urbanized area residents",
+    ]);
+  });
+});

packages/primary/tests/scorecard.test.ts

@@ -1,4 +1,5 @@
 import { expect, test } from "@playwright/test";
+
 import {
   extractCityIdFromUrl,
   determineShareUrl,

packages/shared/tests/cityId.test.ts

@@ -0,0 +1,22 @@
+import { expect, test } from "@playwright/test";
+
+import { formatHeader, formatReformLine } from "../src/js/city-ui/scorecard.ts";
+
+test("formatHeader", () => {
+  const result = formatHeader({
+    name: "My City",
+    percentage: "25%",
+    boundaryDescription: "downtown",
+  });
+  expect(result).toEqual(`
+    <h1 class="scorecard-title">Parking lots in My City</h1>
+    <p>25% of the downtown is off-street parking</p>
+    `);
+});
+
+test("formatReformLine", () => {
+  const result = formatReformLine("adopted", "https://parkingreform.org");
+  expect(result).toEqual(
+    `Parking reforms adopted (<a class="external-link" title="view parking reform details" href="https://parkingreform.org" target="_blank">details <i aria-hidden="true" class="fa-solid fa-arrow-right"></i></a>)`,
+  );
+});