Skip to content

Commit ed8cfa7

Browse files
dwightjackdwightjack
authored
Merge pull request #136 from dwightjack/tailwind4
Tailwind 4
2 parents 7ef6aae + e7f4d75 commit ed8cfa7

40 files changed

+1413
-1085
lines changed

‎.github/workflows/main.yml

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,6 @@ concurrency:
1717
jobs:
1818
build:
1919
runs-on: ubuntu-latest
20-
2120
steps:
2221
- uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4
2322
- uses: pnpm/action-setup@v4
@@ -28,3 +27,24 @@ jobs:
2827
- run: pnpm i
2928
- run: pnpm run lint
3029
- run: pnpm run build
30+
test:
31+
timeout-minutes: 60
32+
runs-on: ubuntu-latest
33+
steps:
34+
- uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4
35+
- uses: pnpm/action-setup@v4
36+
- uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4
37+
with:
38+
node-version-file: '.node-version'
39+
cache: 'pnpm'
40+
- run: pnpm i
41+
- name: Install Playwright Browsers
42+
run: pnpm exec playwright install chromium --with-deps
43+
- name: Run Playwright tests
44+
run: pnpm run test
45+
- uses: actions/upload-artifact@v4
46+
if: ${{ !cancelled() }}
47+
with:
48+
name: playwright-report
49+
path: playwright-report/
50+
retention-days: 10

‎.gitignore

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,10 @@ node_modules
33
dist
44
dist-ssr
55
*.local
6-
!.vscode
6+
!.vscode
7+
8+
# Playwright
9+
/test-results/
10+
/playwright-report/
11+
/blob-report/
12+
/playwright/.cache/

‎.vscode/settings.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,5 +21,6 @@
2121
"**/.git/subtree-cache/**": true,
2222
"**/node_modules/*/**": true
2323
},
24-
"typescript.tsdk": "node_modules/typescript/lib"
24+
"typescript.tsdk": "node_modules/typescript/lib",
25+
"cssVariables.lookupFiles": ["node_modules/tailwindcss/theme.css"]
2526
}

‎index.html

Lines changed: 24 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,27 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8" />
5-
<title>pomodoro-timer</title>
6-
<link rel=icon type=image/png sizes=32x32 href=/img/icons/favicon-32x32.png>
7-
<link rel=icon type=image/png sizes=16x16 href=/img/icons/favicon-16x16.png>
8-
<meta
9-
name="theme-color"
10-
content="#ffffff"
11-
media="(prefers-color-scheme: light)"
12-
/>
13-
<meta
14-
name="theme-color"
15-
content="#292524"
16-
media="(prefers-color-scheme: dark)"
17-
/>
18-
<meta name="apple-mobile-web-app-capable" content="no" />
19-
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
20-
<meta name="apple-mobile-web-app-title" content="Pomodoro Timer" />
21-
<link rel=apple-touch-icon
22-
href=/img/icons/apple-touch-icon-152x152.png><link rel=mask-icon
23-
href=/img/icons/safari-pinned-tab.svg color=#ffffff><meta
24-
name=msapplication-TileImage
25-
content=/img/icons/msapplication-icon-144x144.png>
26-
<meta name="msapplication-TileColor" content="#000000" />
27-
<meta name="color-scheme" content="dark light" />
28-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
29-
</head>
30-
<body>
31-
<div id="app"></div>
32-
<script type="module" src="/src/main.ts"></script>
33-
</body>
3+
4+
<head>
5+
<meta charset="UTF-8" />
6+
<title>Pomodoro Timer</title>
7+
<link rel=icon type=image/png sizes=32x32 href=/img/icons/favicon-32x32.png>
8+
<link rel=icon type=image/png sizes=16x16 href=/img/icons/favicon-16x16.png>
9+
<meta name="theme-color" content="#ffffff" media="(prefers-color-scheme: light)" />
10+
<meta name="theme-color" content="#292524" media="(prefers-color-scheme: dark)" />
11+
<meta name="apple-mobile-web-app-capable" content="no" />
12+
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
13+
<meta name="apple-mobile-web-app-title" content="Pomodoro Timer" />
14+
<link rel=apple-touch-icon href=/img/icons/apple-touch-icon-152x152.png>
15+
<link rel=mask-icon href=/img/icons/safari-pinned-tab.svg color=#ffffff>
16+
<meta name=msapplication-TileImage content=/img/icons/msapplication-icon-144x144.png>
17+
<meta name="msapplication-TileColor" content="#000000" />
18+
<meta name="color-scheme" content="dark light" />
19+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
20+
</head>
21+
22+
<body>
23+
<div id="app"></div>
24+
<script type="module" src="/src/main.ts"></script>
25+
</body>
26+
3427
</html>

‎package.json

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,35 +5,39 @@
55
"description": "A configurable pomodoro-like timer",
66
"type": "module",
77
"scripts": {
8-
"dev": "vite",
8+
"dev": "vite --port 8888",
99
"build": "vue-tsc --noEmit && vite build",
1010
"lint": "eslint 'src/**/*.*'",
11-
"serve": "vite preview"
11+
"serve": "vite preview",
12+
"dev:test": "vite dev --port 8888 --mode=test",
13+
"test": "playwright test"
1214
},
1315
"packageManager": "[email protected]",
1416
"engines": {
1517
"node": ">=20.11.1",
1618
"pnpm": "^9.0.0"
1719
},
1820
"dependencies": {
21+
"@vueuse/core": "12.8.2",
1922
"pinia": "2.3.1",
2023
"uid": "2.0.2",
2124
"vue": "3.5.13",
2225
"vue-types": "5.1.3"
2326
},
2427
"devDependencies": {
2528
"@eslint/js": "9.20.0",
29+
"@playwright/test": "^1.51.0",
30+
"@tailwindcss/vite": "4.0.9",
2631
"@types/node": "22.13.7",
2732
"@vitejs/plugin-vue": "5.2.1",
2833
"@vue/compiler-sfc": "3.5.13",
29-
"autoprefixer": "10.4.20",
3034
"eslint": "9.20.1",
3135
"eslint-config-prettier": "9.1.0",
3236
"eslint-plugin-prettier": "5.2.3",
3337
"eslint-plugin-vue": "9.32.0",
34-
"postcss": "8.5.3",
3538
"prettier": "3.5.2",
36-
"tailwindcss": "3.4.17",
39+
"prettier-plugin-tailwindcss": "0.6.11",
40+
"tailwindcss": "4.0.9",
3741
"typescript": "5.7.3",
3842
"typescript-eslint": "8.24.1",
3943
"vite": "6.1.1",
@@ -43,6 +47,9 @@
4347
"vue-tsc": "2.2.4"
4448
},
4549
"prettier": {
50+
"plugins": [
51+
"prettier-plugin-tailwindcss"
52+
],
4653
"trailingComma": "all",
4754
"arrowParens": "always",
4855
"semi": true,

‎playwright.config.ts

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import { defineConfig, devices } from '@playwright/test';
2+
3+
/**
4+
* Read environment variables from file.
5+
* https://github.com/motdotla/dotenv
6+
*/
7+
// import dotenv from 'dotenv';
8+
// import path from 'path';
9+
// dotenv.config({ path: path.resolve(__dirname, '.env') });
10+
11+
/**
12+
* See https://playwright.dev/docs/test-configuration.
13+
*/
14+
export default defineConfig({
15+
testDir: './tests',
16+
/* Run tests in files in parallel */
17+
fullyParallel: true,
18+
/* Fail the build on CI if you accidentally left test.only in the source code. */
19+
forbidOnly: !!process.env.CI,
20+
/* Retry on CI only */
21+
retries: process.env.CI ? 2 : 0,
22+
/* Opt out of parallel tests on CI. */
23+
workers: process.env.CI ? 1 : undefined,
24+
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
25+
reporter: 'html',
26+
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
27+
use: {
28+
/* Base URL to use in actions like `await page.goto('/')`. */
29+
baseURL: 'http://localhost:8888',
30+
31+
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
32+
trace: 'on-first-retry',
33+
},
34+
35+
/* Configure projects for major browsers */
36+
projects: [
37+
{
38+
name: 'chromium',
39+
use: { ...devices['Desktop Chrome'] },
40+
},
41+
42+
{
43+
name: 'Mobile Chrome',
44+
use: { ...devices['Pixel 5'] },
45+
},
46+
],
47+
48+
webServer: {
49+
command: 'pnpm run dev:test',
50+
url: 'http://localhost:8888',
51+
reuseExistingServer: !process.env.CI,
52+
},
53+
});

0 commit comments

Comments
 (0)