Merge pull request #43 from Adyen/develop

Adyen Document Viewer v1.1.3
Adyen · Nov 21, 2024 · c40014c · c40014c
2 parents 2f43bfe + 65dfaec
commit c40014c
Show file tree

Hide file tree

Showing 11 changed files with 486 additions and 33 deletions.
diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml
@@ -0,0 +1,41 @@
+name: PR CI
+
+on:
+  pull_request:
+    types: [opened, synchronize, reopened]
+    paths-ignore:
+      - README.md
+      - LICENSE
+      - .gitignore
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+    timeout-minutes: 2
+    steps:
+      - name: Checkout the repo
+        uses: actions/checkout@v4
+
+      - run: npm i
+      - run: npm run check:all
+
+  build:
+    runs-on: ubuntu-latest
+    timeout-minutes: 2
+    steps:
+      - name: Checkout the repo
+        uses: actions/checkout@v4
+
+      - run: npm i
+      - run: npm run build
+
+  test:
+    runs-on: ubuntu-latest
+    timeout-minutes: 3
+    steps:
+      - name: Checkout the repo
+        uses: actions/checkout@v4
+
+      - run: npm i
+      - run: npx playwright install
+      - run: npm run test
diff --git a/.gitignore b/.gitignore
@@ -3,4 +3,8 @@ node_modules
 .idea
 dist
 adyen-document-viewer.iml
-package-lock.json
+package-lock.json
+
+# Playwright
+test-results/
+playwright-report/
diff --git a/package.json b/package.json
@@ -7,7 +7,7 @@
     "viewer",
     "adyen-document-viewer"
   ],
-  "version": "1.1.2",
+  "version": "1.1.3",
   "description": "Adyen Document Viewer",
   "main": "./dist/adyen-document-viewer.min.js",
   "module": "./dist/adyen-document-viewer.min.mjs",
@@ -16,20 +16,25 @@
   "scripts": {
     "start": "vite",
     "build": "vite build && npm run types:build",
+    "check:all": "npm run types:check && npm run lint && npm run prettier",
     "lint": "eslint 'src/**/*.{js,ts,tsx}'",
     "lint:fix": "npm run lint -- --fix",
     "prettier": "prettier --config ./prettier.config.js --ignore-unknown --check \"**/*\"",
     "prettier:fix": "prettier --config ./prettier.config.js --ignore-unknown --write \"**/*\"",
     "fix:all": "npm run prettier:fix && npm run lint:fix",
+    "test": "playwright test",
+    "test:debug": "playwright test --debug",
+    "test:ui": "playwright test --ui",
     "types:build": "tsc --project tsconfig-build.json",
-    "types:check": "tsc && tsc-strict",
+    "types:check": "tsc",
     "types:watch": "tsc --watch --preserveWatchOutput"
   },
   "dependencies": {
     "classnames": "2.5.1",
     "preact": "10.19.3"
   },
   "devDependencies": {
+    "@playwright/test": "^1.45.3",
     "@preact/preset-vite": "^2.8.1",
     "@typescript-eslint/eslint-plugin": "^6.19.1",
     "@typescript-eslint/parser": "^6.19.1",
@@ -48,7 +53,6 @@
     "stylelint-config-sass-guidelines": "^9.0.1",
     "stylelint-scss": "^4.2.0",
     "typescript": "^5.3.3",
-    "typescript-strict-plugin": "^2.2.0",
     "vite": "^4.5.1"
   },
   "license": "MIT",

diff --git a/index.html → playground/index.html b/index.html → playground/index.html
@@ -7,6 +7,7 @@
   </head>
   <body>
     <div id="document-viewer"></div>
-    <script defer type="module" src="/playground/example.js"></script>
+
+    <script type="module" src="./example.js"></script>
   </body>
 </html>
diff --git a/playground/loadViaEsModuleImport.html b/playground/loadViaEsModuleImport.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Adyen Document Viewer Example</title>
+
+    <link rel="stylesheet" href="/adyen-document-viewer.min.css" />
+  </head>
+  <body>
+    <div id="document-viewer"></div>
+
+    <script type="module">
+      import AdyenDocumentViewer from '/adyen-document-viewer.min.mjs?url';
+      import exampleDocument from './mock-data';
+
+      const documentViewer = new AdyenDocumentViewer('#document-viewer', {
+        onExpandSection: (sectionTitle) => console.log(`${sectionTitle} expanded`),
+        multiple: false,
+      });
+
+      documentViewer.render(exampleDocument);
+    </script>
+  </body>
+</html>