From 88f6c2076811199c9aaf8c2e24c59d7d6bccd917 Mon Sep 17 00:00:00 2001 From: Tsotne Gvadzabia Date: Sun, 21 Jul 2024 21:20:04 +0100 Subject: [PATCH 1/3] init preact --- apps/preact-app/.gitignore | 24 ++++ apps/preact-app/index.html | 13 +++ apps/preact-app/package.json | 20 ++++ apps/preact-app/public/vite.svg | 1 + apps/preact-app/src/app.css | 35 ++++++ apps/preact-app/src/app.tsx | 46 ++++++++ apps/preact-app/src/assets/preact.svg | 1 + apps/preact-app/src/index.css | 68 +++++++++++ apps/preact-app/src/main.tsx | 5 + apps/preact-app/src/vite-env.d.ts | 1 + apps/preact-app/tests/main.spec.ts | 26 +++++ apps/preact-app/tsconfig.app.json | 32 ++++++ apps/preact-app/tsconfig.json | 11 ++ apps/preact-app/tsconfig.node.json | 13 +++ apps/preact-app/vite.config.ts | 21 ++++ package.json | 3 + pnpm-lock.yaml | 155 ++++++++++++++++++++++++-- 17 files changed, 468 insertions(+), 7 deletions(-) create mode 100644 apps/preact-app/.gitignore create mode 100644 apps/preact-app/index.html create mode 100644 apps/preact-app/package.json create mode 100644 apps/preact-app/public/vite.svg create mode 100644 apps/preact-app/src/app.css create mode 100644 apps/preact-app/src/app.tsx create mode 100644 apps/preact-app/src/assets/preact.svg create mode 100644 apps/preact-app/src/index.css create mode 100644 apps/preact-app/src/main.tsx create mode 100644 apps/preact-app/src/vite-env.d.ts create mode 100644 apps/preact-app/tests/main.spec.ts create mode 100644 apps/preact-app/tsconfig.app.json create mode 100644 apps/preact-app/tsconfig.json create mode 100644 apps/preact-app/tsconfig.node.json create mode 100644 apps/preact-app/vite.config.ts diff --git a/apps/preact-app/.gitignore b/apps/preact-app/.gitignore new file mode 100644 index 0000000..a547bf3 --- /dev/null +++ b/apps/preact-app/.gitignore @@ -0,0 +1,24 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/apps/preact-app/index.html b/apps/preact-app/index.html new file mode 100644 index 0000000..235bdf6 --- /dev/null +++ b/apps/preact-app/index.html @@ -0,0 +1,13 @@ + + + + + + + Vite + Preact + + +
+ + + diff --git a/apps/preact-app/package.json b/apps/preact-app/package.json new file mode 100644 index 0000000..6ec4c8f --- /dev/null +++ b/apps/preact-app/package.json @@ -0,0 +1,20 @@ +{ + "name": "preact-app", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite", + "build": "tsc -b && vite build", + "preview": "vite preview" + }, + "dependencies": { + "preact": "^10.22.1" + }, + "devDependencies": { + "@preact/preset-vite": "^2.8.3", + "typescript": "^5.2.2", + "vite": "^5.3.4", + "vite-plugin-hash-csp": "workspace:^" + } +} diff --git a/apps/preact-app/public/vite.svg b/apps/preact-app/public/vite.svg new file mode 100644 index 0000000..e7b8dfb --- /dev/null +++ b/apps/preact-app/public/vite.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/preact-app/src/app.css b/apps/preact-app/src/app.css new file mode 100644 index 0000000..2139a70 --- /dev/null +++ b/apps/preact-app/src/app.css @@ -0,0 +1,35 @@ +#app { + max-width: 1280px; + margin: 0 auto; + padding: 2rem; + text-align: center; +} + +.logo { + height: 6em; + padding: 1.5em; +} +.logo:hover { + filter: drop-shadow(0 0 2em #646cffaa); +} +.logo.preact:hover { + filter: drop-shadow(0 0 2em #673ab8aa); +} + +.card { + padding: 2em; +} + +.read-the-docs { + color: #888; +} + +.button{ + background-color: #673ab8; + color: white; + padding: 1em 2em; + border: none; + border-radius: 0.5em; + font-size: 1em; + cursor: pointer; +} diff --git a/apps/preact-app/src/app.tsx b/apps/preact-app/src/app.tsx new file mode 100644 index 0000000..13fba1d --- /dev/null +++ b/apps/preact-app/src/app.tsx @@ -0,0 +1,46 @@ +import { useState } from "preact/hooks"; +import preactLogo from "./assets/preact.svg"; +import viteLogo from "/vite.svg"; +import "./app.css"; + +export function App() { + const [count, setCount] = useState(0); + + return ( + <> +
+ + + + + + +
+

Vite + Preact

+
+ +

+ Edit src/app.tsx and save to test HMR +

+
+

+ Check out{" "} + + create-preact + + , the official Preact + Vite starter +

+

+ Click on the Vite and Preact logos to learn more +

+ + ); +} diff --git a/apps/preact-app/src/assets/preact.svg b/apps/preact-app/src/assets/preact.svg new file mode 100644 index 0000000..908f17d --- /dev/null +++ b/apps/preact-app/src/assets/preact.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/preact-app/src/index.css b/apps/preact-app/src/index.css new file mode 100644 index 0000000..6119ad9 --- /dev/null +++ b/apps/preact-app/src/index.css @@ -0,0 +1,68 @@ +:root { + font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif; + line-height: 1.5; + font-weight: 400; + + color-scheme: light dark; + color: rgba(255, 255, 255, 0.87); + background-color: #242424; + + font-synthesis: none; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +a { + font-weight: 500; + color: #646cff; + text-decoration: inherit; +} +a:hover { + color: #535bf2; +} + +body { + margin: 0; + display: flex; + place-items: center; + min-width: 320px; + min-height: 100vh; +} + +h1 { + font-size: 3.2em; + line-height: 1.1; +} + +button { + border-radius: 8px; + border: 1px solid transparent; + padding: 0.6em 1.2em; + font-size: 1em; + font-weight: 500; + font-family: inherit; + background-color: #1a1a1a; + cursor: pointer; + transition: border-color 0.25s; +} +button:hover { + border-color: #646cff; +} +button:focus, +button:focus-visible { + outline: 4px auto -webkit-focus-ring-color; +} + +@media (prefers-color-scheme: light) { + :root { + color: #213547; + background-color: #ffffff; + } + a:hover { + color: #747bff; + } + button { + background-color: #f9f9f9; + } +} diff --git a/apps/preact-app/src/main.tsx b/apps/preact-app/src/main.tsx new file mode 100644 index 0000000..846cd1e --- /dev/null +++ b/apps/preact-app/src/main.tsx @@ -0,0 +1,5 @@ +import { render } from 'preact' +import { App } from './app.tsx' +import './index.css' + +render(, document.getElementById('app')!) diff --git a/apps/preact-app/src/vite-env.d.ts b/apps/preact-app/src/vite-env.d.ts new file mode 100644 index 0000000..11f02fe --- /dev/null +++ b/apps/preact-app/src/vite-env.d.ts @@ -0,0 +1 @@ +/// diff --git a/apps/preact-app/tests/main.spec.ts b/apps/preact-app/tests/main.spec.ts new file mode 100644 index 0000000..946aa3a --- /dev/null +++ b/apps/preact-app/tests/main.spec.ts @@ -0,0 +1,26 @@ +import { test, expect } from "@playwright/test"; + +const TITLE = "Vite + Preact"; + +test("Index HTML Loaded", async ({ page }) => { + await page.goto("/"); + await expect(page).toHaveTitle(TITLE); +}); + +test("Loaded main JS script", async ({ page }) => { + await page.goto("/"); + await expect(page.locator(`text=${TITLE}`)).toBeVisible(); +}); + +test("Loaded CSS Styles", async ({ page }) => { + await page.goto("/"); + + const element = page.getByRole("heading", { name: TITLE }); + await expect(element).toBeVisible(); + + const color = await element.evaluate( + (el) => window.getComputedStyle(el).backgroundColor + ); + + expect(color).toBe("rgb(103, 58, 184)"); +}); diff --git a/apps/preact-app/tsconfig.app.json b/apps/preact-app/tsconfig.app.json new file mode 100644 index 0000000..4364850 --- /dev/null +++ b/apps/preact-app/tsconfig.app.json @@ -0,0 +1,32 @@ +{ + "compilerOptions": { + "composite": true, + "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo", + "target": "ES2020", + "useDefineForClassFields": true, + "module": "ESNext", + "lib": ["ES2020", "DOM", "DOM.Iterable"], + "skipLibCheck": true, + "paths": { + "react": ["./node_modules/preact/compat/"], + "react-dom": ["./node_modules/preact/compat/"] + }, + + /* Bundler mode */ + "moduleResolution": "bundler", + "allowImportingTsExtensions": true, + "resolveJsonModule": true, + "isolatedModules": true, + "moduleDetection": "force", + "noEmit": true, + "jsx": "react-jsx", + "jsxImportSource": "preact", + + /* Linting */ + "strict": true, + "noUnusedLocals": true, + "noUnusedParameters": true, + "noFallthroughCasesInSwitch": true + }, + "include": ["src"] +} diff --git a/apps/preact-app/tsconfig.json b/apps/preact-app/tsconfig.json new file mode 100644 index 0000000..ea9d0cd --- /dev/null +++ b/apps/preact-app/tsconfig.json @@ -0,0 +1,11 @@ +{ + "files": [], + "references": [ + { + "path": "./tsconfig.app.json" + }, + { + "path": "./tsconfig.node.json" + } + ] +} diff --git a/apps/preact-app/tsconfig.node.json b/apps/preact-app/tsconfig.node.json new file mode 100644 index 0000000..3afdd6e --- /dev/null +++ b/apps/preact-app/tsconfig.node.json @@ -0,0 +1,13 @@ +{ + "compilerOptions": { + "composite": true, + "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo", + "skipLibCheck": true, + "module": "ESNext", + "moduleResolution": "bundler", + "allowSyntheticDefaultImports": true, + "strict": true, + "noEmit": true + }, + "include": ["vite.config.ts"] +} diff --git a/apps/preact-app/vite.config.ts b/apps/preact-app/vite.config.ts new file mode 100644 index 0000000..827c049 --- /dev/null +++ b/apps/preact-app/vite.config.ts @@ -0,0 +1,21 @@ +import { defineConfig, PluginOption } from "vite"; +import preact from "@preact/preset-vite"; +import csp from "vite-plugin-hash-csp"; + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [ + preact(), + csp({ + dev: { + run: true, + }, + }) as PluginOption, //This is a type assertion due to a monorepo issue regarding stylus, this is not needed in a normal project + ], + preview: { + port: 4009, + }, + server: { + port: 3009, + }, +}); diff --git a/package.json b/package.json index 88ab6df..7ed47c7 100644 --- a/package.json +++ b/package.json @@ -31,6 +31,9 @@ "re:dev": "turbo dev --filter=remix-app", "re:build": "turbo build --filter=remix-app", "re:preview": "turbo preview --filter=remix-app", + "pr:dev": "turbo dev --filter=preact-app", + "pr:build": "turbo build --filter=preact-app", + "pr:preview": "turbo preview --filter=preact-app", "vue:dev": "turbo dev --filter=vue-app", "vue:build": "turbo build --filter=vue-app", "vue:preview": "turbo preview --filter=vue-app", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 3a7e31e..1dbdc0a 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -235,6 +235,25 @@ importers: specifier: workspace:^ version: link:../../packages/vite-plugin-hash-csp + apps/preact-app: + dependencies: + preact: + specifier: ^10.22.1 + version: 10.22.1 + devDependencies: + '@preact/preset-vite': + specifier: ^2.8.3 + version: 2.9.0(@babel/core@7.24.8)(preact@10.22.1)(vite@5.3.4) + typescript: + specifier: ^5.2.2 + version: 5.5.3 + vite: + specifier: ^5.3.4 + version: 5.3.4(@types/node@20.14.10) + vite-plugin-hash-csp: + specifier: workspace:^ + version: link:../../packages/vite-plugin-hash-csp + apps/react: dependencies: '@repo/eslint-config': @@ -915,6 +934,18 @@ packages: - supports-color dev: true + /@babel/plugin-transform-react-jsx-development@7.24.7(@babel/core@7.24.8): + resolution: {integrity: sha512-QG9EnzoGn+Qar7rxuW+ZOsbWOt56FvvI93xInqsZDC5fsekx1AlIO4KIJ5M+D0p0SqSH156EpmZyXq630B8OlQ==} + engines: {node: '>=6.9.0'} + peerDependencies: + '@babel/core': ^7.0.0-0 + dependencies: + '@babel/core': 7.24.8 + '@babel/plugin-transform-react-jsx': 7.24.7(@babel/core@7.24.8) + transitivePeerDependencies: + - supports-color + dev: true + /@babel/plugin-transform-react-jsx-self@7.24.7(@babel/core@7.24.8): resolution: {integrity: sha512-fOPQYbGSgH0HUp4UJO4sMBFjY6DuWq+2i8rixyUMb3CdGixs/gccURvYOAhajBdKDoGajFr3mUq5rH3phtkGzw==} engines: {node: '>=6.9.0'} @@ -935,6 +966,22 @@ packages: '@babel/helper-plugin-utils': 7.24.8 dev: true + /@babel/plugin-transform-react-jsx@7.24.7(@babel/core@7.24.8): + resolution: {integrity: sha512-+Dj06GDZEFRYvclU6k4bme55GKBEWUmByM/eoKuqg4zTNQHiApWRhQph5fxQB2wAEFvRzL1tOEj1RJ19wJrhoA==} + engines: {node: '>=6.9.0'} + peerDependencies: + '@babel/core': ^7.0.0-0 + dependencies: + '@babel/core': 7.24.8 + '@babel/helper-annotate-as-pure': 7.24.7 + '@babel/helper-module-imports': 7.24.7 + '@babel/helper-plugin-utils': 7.24.8 + '@babel/plugin-syntax-jsx': 7.24.7(@babel/core@7.24.8) + '@babel/types': 7.24.8 + transitivePeerDependencies: + - supports-color + dev: true + /@babel/plugin-transform-typescript@7.24.8(@babel/core@7.24.8): resolution: {integrity: sha512-CgFgtN61BbdOGCP4fLaAMOPkzWUh6yQZNMr5YSt8uz2cZSSiQONCQFWqsE4NeVfOIhqDOlS9CR3WD91FzMeB2Q==} engines: {node: '>=6.9.0'} @@ -2217,6 +2264,65 @@ packages: resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==} dev: false + /@preact/preset-vite@2.9.0(@babel/core@7.24.8)(preact@10.22.1)(vite@5.3.4): + resolution: {integrity: sha512-B9yVT7AkR6owrt84K3pLNyaKSvlioKdw65VqE/zMiR6HMovPekpsrwBNs5DJhBFEd5cvLMtCjHNHZ9P7Oblveg==} + peerDependencies: + '@babel/core': 7.x + vite: 2.x || 3.x || 4.x || 5.x + dependencies: + '@babel/code-frame': 7.24.7 + '@babel/core': 7.24.8 + '@babel/plugin-transform-react-jsx': 7.24.7(@babel/core@7.24.8) + '@babel/plugin-transform-react-jsx-development': 7.24.7(@babel/core@7.24.8) + '@prefresh/vite': 2.4.6(preact@10.22.1)(vite@5.3.4) + '@rollup/pluginutils': 4.2.1 + babel-plugin-transform-hook-names: 1.0.2(@babel/core@7.24.8) + debug: 4.3.5 + kolorist: 1.8.0 + magic-string: 0.30.5 + node-html-parser: 6.1.13 + resolve: 1.22.8 + source-map: 0.7.4 + stack-trace: 1.0.0-pre2 + vite: 5.3.4(@types/node@20.14.10) + transitivePeerDependencies: + - preact + - supports-color + dev: true + + /@prefresh/babel-plugin@0.5.1: + resolution: {integrity: sha512-uG3jGEAysxWoyG3XkYfjYHgaySFrSsaEb4GagLzYaxlydbuREtaX+FTxuIidp241RaLl85XoHg9Ej6E4+V1pcg==} + dev: true + + /@prefresh/core@1.5.2(preact@10.22.1): + resolution: {integrity: sha512-A/08vkaM1FogrCII5PZKCrygxSsc11obExBScm3JF1CryK2uDS3ZXeni7FeKCx1nYdUkj4UcJxzPzc1WliMzZA==} + peerDependencies: + preact: ^10.0.0 + dependencies: + preact: 10.22.1 + dev: true + + /@prefresh/utils@1.2.0: + resolution: {integrity: sha512-KtC/fZw+oqtwOLUFM9UtiitB0JsVX0zLKNyRTA332sqREqSALIIQQxdUCS1P3xR/jT1e2e8/5rwH6gdcMLEmsQ==} + dev: true + + /@prefresh/vite@2.4.6(preact@10.22.1)(vite@5.3.4): + resolution: {integrity: sha512-miYbTl2J1YNaQJWyWHJzyIpNh7vKUuXC1qCDRzPeWjhQ+9bxeXkUBGDGd9I1f37R5GQYi1S65AN5oR0BR2WzvQ==} + peerDependencies: + preact: ^10.4.0 + vite: '>=2.0.0' + dependencies: + '@babel/core': 7.24.8 + '@prefresh/babel-plugin': 0.5.1 + '@prefresh/core': 1.5.2(preact@10.22.1) + '@prefresh/utils': 1.2.0 + '@rollup/pluginutils': 4.2.1 + preact: 10.22.1 + vite: 5.3.4(@types/node@20.14.10) + transitivePeerDependencies: + - supports-color + dev: true + /@remix-run/dev@2.10.2(@remix-run/react@2.10.2)(@remix-run/serve@2.10.2)(@types/node@20.14.10)(typescript@5.5.3)(vite@5.3.4): resolution: {integrity: sha512-7hHC9WY65IJ5ex9Vrv9PkSg15mmYH63unxPDAR74hSfSkectMgsWtMChzdx7Kp/CzN2rttt3cxPwZnAu6PXJUw==} engines: {node: '>=18.0.0'} @@ -2490,6 +2596,14 @@ packages: typescript: 5.5.3 dev: true + /@rollup/pluginutils@4.2.1: + resolution: {integrity: sha512-iKnFXr7NkdZAIHiIWE+BX5ULi/ucVFYWD6TbAV+rZctiRTY2PL6tsIKhoIOaoskiWAkgu+VsbXgUVDNLHf+InQ==} + engines: {node: '>= 8.0.0'} + dependencies: + estree-walker: 2.0.2 + picomatch: 2.3.1 + dev: true + /@rollup/pluginutils@5.1.0(rollup@4.18.1): resolution: {integrity: sha512-XTIWOPPcpvyKI6L1NHo0lFlCyznUEyPmPY1mc3KpPVDYulHSTvyeLNVW00QTLIAFNhR3kYnJTQHeGqU4M3n09g==} engines: {node: '>=14.0.0'} @@ -3739,6 +3853,14 @@ packages: resolve: 1.22.8 dev: false + /babel-plugin-transform-hook-names@1.0.2(@babel/core@7.24.8): + resolution: {integrity: sha512-5gafyjyyBTTdX/tQQ0hRgu4AhNHG/hqWi0ZZmg2xvs2FgRkJXzDNKBZCyoYqgFkovfDrgM8OoKg8karoUvWeCw==} + peerDependencies: + '@babel/core': ^7.12.10 + dependencies: + '@babel/core': 7.24.8 + dev: true + /bail@2.0.2: resolution: {integrity: sha512-0xO6mYd7JB2YesxDKplafRpsiOzPt9V02ddPCLbY1xYGPOX24NTyN50qnUxgCPcSoYMhKpAuBTjQoRZCAkUDRw==} @@ -3789,7 +3911,6 @@ packages: /boolbase@1.0.0: resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==} - dev: false /brace-expansion@1.1.11: resolution: {integrity: sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==} @@ -4223,7 +4344,6 @@ packages: domhandler: 5.0.3 domutils: 3.1.0 nth-check: 2.1.1 - dev: false /css-what@6.1.0: resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==} @@ -4771,18 +4891,15 @@ packages: domelementtype: 2.3.0 domhandler: 5.0.3 entities: 4.5.0 - dev: false /domelementtype@2.3.0: resolution: {integrity: sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==} - dev: false /domhandler@5.0.3: resolution: {integrity: sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==} engines: {node: '>= 4'} dependencies: domelementtype: 2.3.0 - dev: false /dompurify@3.1.6: resolution: {integrity: sha512-cTOAhc36AalkjtBpfG6O8JimdTMWNXjiePT2xQH/ppBGi/4uIpmj8eKyIkMJErXWARyINV/sB38yf8JCLF5pbQ==} @@ -4794,7 +4911,6 @@ packages: dom-serializer: 2.0.0 domelementtype: 2.3.0 domhandler: 5.0.3 - dev: false /dotenv@16.0.3: resolution: {integrity: sha512-7GO6HghkA5fYG9TYnNxi14/7K9f5occMlp3zXAuSxn7CKCxt9xbNWG7yF8hTCSUchlfWSe3uLmlPfigevRItzQ==} @@ -6912,6 +7028,10 @@ packages: resolution: {integrity: sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==} engines: {node: '>=6'} + /kolorist@1.8.0: + resolution: {integrity: sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==} + dev: true + /language-subtag-registry@0.3.23: resolution: {integrity: sha512-0K65Lea881pHotoGEa5gDlMxt3pctLi2RplBb7Ezh4rRdLEOtgi7n4EwK9lamnUCkKBqaeKRVebTq6BAxSkpXQ==} dev: true @@ -7067,6 +7187,13 @@ packages: dependencies: '@jridgewell/sourcemap-codec': 1.5.0 + /magic-string@0.30.5: + resolution: {integrity: sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==} + engines: {node: '>=12'} + dependencies: + '@jridgewell/sourcemap-codec': 1.5.0 + dev: true + /make-dir@2.1.0: resolution: {integrity: sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==} engines: {node: '>=6'} @@ -8069,6 +8196,13 @@ packages: - supports-color dev: false + /node-html-parser@6.1.13: + resolution: {integrity: sha512-qIsTMOY4C/dAa5Q5vsobRpOOvPfC4pB61UVW2uSwZNUp0QU/jCekTal1vMmbO0DgdHeLUJpv/ARmDqErVxA3Sg==} + dependencies: + css-select: 5.1.0 + he: 1.2.0 + dev: true + /node-releases@2.0.14: resolution: {integrity: sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==} dev: true @@ -8167,7 +8301,6 @@ packages: resolution: {integrity: sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==} dependencies: boolbase: 1.0.0 - dev: false /object-assign@4.1.1: resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==} @@ -8722,6 +8855,9 @@ packages: picocolors: 1.0.1 source-map-js: 1.2.0 + /preact@10.22.1: + resolution: {integrity: sha512-jRYbDDgMpIb5LHq3hkI0bbl+l/TQ9UnkdQ0ww+lp+4MMOdqaUYdFc5qeyP+IV8FAd/2Em7drVPeKdQxsiWCf/A==} + /prelude-ls@1.2.1: resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==} engines: {node: '>= 0.8.0'} @@ -9539,6 +9675,11 @@ packages: minipass: 7.1.2 dev: true + /stack-trace@1.0.0-pre2: + resolution: {integrity: sha512-2ztBJRek8IVofG9DBJqdy2N5kulaacX30Nz7xmkYF6ale9WBVmIy6mFBchvGX7Vx/MyjBhx+Rcxqrj+dbOnQ6A==} + engines: {node: '>=16'} + dev: true + /stackback@0.0.2: resolution: {integrity: sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==} dev: true From a083962edc5c6a895f6d1e1ba23241b665c3e0ad Mon Sep 17 00:00:00 2001 From: Tsotne Gvadzabia Date: Sun, 21 Jul 2024 21:23:41 +0100 Subject: [PATCH 2/3] add tests --- playwright.config.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/playwright.config.ts b/playwright.config.ts index 891d877..8ef7755 100644 --- a/playwright.config.ts +++ b/playwright.config.ts @@ -104,6 +104,18 @@ const APPS = [ testDir: "./apps/vue/tests", name: "Vue - Build", }, + { + url: "http://localhost:3009", + command: `pnpm pr:dev`, + testDir: "./apps/preact-app/tests", + name: "Preact - Dev", + }, + { + url: "http://localhost:4009", + command: `pnpm pr:preview`, + testDir: "./apps/preact-app/tests", + name: "Preact - Build", + }, ]; /** From f942b8762be576b3568c3cb57cb0c486f5d4a410 Mon Sep 17 00:00:00 2001 From: Tsotne Gvadzabia Date: Sun, 21 Jul 2024 22:00:55 +0100 Subject: [PATCH 3/3] fix tests --- apps/preact-app/tests/main.spec.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/apps/preact-app/tests/main.spec.ts b/apps/preact-app/tests/main.spec.ts index 946aa3a..ca39b67 100644 --- a/apps/preact-app/tests/main.spec.ts +++ b/apps/preact-app/tests/main.spec.ts @@ -16,9 +16,10 @@ test("Loaded CSS Styles", async ({ page }) => { await page.goto("/"); const element = page.getByRole("heading", { name: TITLE }); + const button = page.getByRole("button", { name: "count is" }); await expect(element).toBeVisible(); - const color = await element.evaluate( + const color = await button.evaluate( (el) => window.getComputedStyle(el).backgroundColor );