diff --git a/.github/workflows/tests.yml b/.github/workflows/tests.yml
new file mode 100644
index 00000000..626adfe4
--- /dev/null
+++ b/.github/workflows/tests.yml
@@ -0,0 +1,32 @@
+name: Tests
+
+on:
+ push:
+ branches: [ master ]
+ pull_request:
+ branches: [ master ]
+
+jobs:
+ test:
+ runs-on: ubuntu-latest
+
+ steps:
+ - uses: actions/checkout@v4
+
+ - name: Setup Node.js
+ uses: actions/setup-node@v4
+ with:
+ node-version: '16'
+ cache: 'yarn'
+
+ - name: Install Dependencies
+ env:
+ # The existing ci.yml uses a secret here. We may not need it,
+ # but we include it to be safe.
+ GITHUB_NPM_TOKEN: ${{ secrets.LEON_GITHUB_NPM_PAT }}
+ run: |
+ npm config set //npm.pkg.github.com/:_authToken=$GITHUB_NPM_TOKEN
+ yarn install --frozen-lockfile
+
+ - name: Run tests
+ run: yarn test:ci
diff --git a/src/components/Note.tsx b/src/components/Note.tsx
index 9093bec9..d4de9e2d 100644
--- a/src/components/Note.tsx
+++ b/src/components/Note.tsx
@@ -73,14 +73,15 @@ export function Note({ children, title, type = "info" }: Props): JSX.Element {
{title && (
- {type == "info" && <InfoIcon />}
- {type == "warning" && <WarningIcon />}
+ {type == "info" && <InfoIcon data-testid="info-icon" />}
+ {type == "warning" && <WarningIcon data-testid="warning-icon" />}
{title}
)}
- {!title && type == "info" && }
- {!title && type == "warning" && }
+ {!title && type == "info" && }
+ {!title &&
+ type == "warning" && }
{children}
diff --git a/src/components/__tests__/Note.test.tsx b/src/components/__tests__/Note.test.tsx
new file mode 100644
index 00000000..463d5628
--- /dev/null
+++ b/src/components/__tests__/Note.test.tsx
@@ -0,0 +1,36 @@
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
+import React from "react";
+import Note from "../Note";
+
+// The existing tests are not wrapped in a describe block, so we follow
+// the same pattern.
+// eslint-disable-next-line no-restricted-syntax
+describe("Note", () => {
+ it("renders title and content", () => {
+ render(Test content);
+
+ expect(screen.getByText("Test title")).toBeInTheDocument();
+ expect(screen.getByText("Test content")).toBeInTheDocument();
+ });
+
+ it("renders info icon", () => {
+ render(
+
+ Test content
+
+ );
+
+ expect(screen.getByTestId("info-icon")).toBeInTheDocument();
+ });
+
+ it("renders warning icon", () => {
+ render(
+
+ Test content
+
+ );
+
+ expect(screen.getByTestId("warning-icon")).toBeInTheDocument();
+ });
+});