diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml
index 4afcf0b8..ec66c26f 100644
--- a/.github/workflows/e2e.yml
+++ b/.github/workflows/e2e.yml
@@ -8,12 +8,37 @@ jobs:
timeout-minutes: 5
runs-on: ubuntu-latest
steps:
- - name: Prepare Playwright
- uses: actions/checkout@v2
+ - uses: actions/checkout@v3
+
+ - uses: pnpm/action-setup@v2
+ with:
+ version: 8
+
- uses: actions/setup-node@v2
with:
- node-version: "18"
- - run: yarn
- - run: npx playwright install --with-deps
+ node-version: 18.x
+ cache: 'pnpm'
+
+ - run: pnpm install
+ env:
+ CI: true
+
+ - name: Store Playwright's Version
+ run: |
+ PLAYWRIGHT_VERSION=$(pnpm ls @playwright/test | grep @playwright | sed 's/.*@//')
+ echo "Playwright's Version: $PLAYWRIGHT_VERSION"
+ echo "PLAYWRIGHT_VERSION=$PLAYWRIGHT_VERSION" >> $GITHUB_ENV
+
+ - name: Cache Playwright Browsers for Playwright's Version
+ id: cache-playwright-browsers
+ uses: actions/cache@v3
+ with:
+ path: ~/.cache/ms-playwright
+ key: playwright-browsers-${{ env.PLAYWRIGHT_VERSION }}
+
+ - name: Setup Playwright
+ if: steps.cache-playwright-browsers.outputs.cache-hit != 'true'
+ run: npx playwright install --with-deps
+
- name: Run tests
- run: yarn test:e2e
+ run: pnpm test:e2e
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
index 844ed17d..7308ae65 100644
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -4,29 +4,23 @@ on: push
jobs:
test:
+ name: Run Unit Tests
runs-on: ubuntu-latest
steps:
- - uses: actions/checkout@v2
+ - uses: actions/checkout@v3
- - name: Get yarn cache
- id: yarn-cache
- run: echo "::set-output name=dir::$(yarn cache dir)"
-
- - uses: actions/cache@v1
+ - uses: pnpm/action-setup@v2
with:
- path: ${{ steps.yarn-cache.outputs.dir }}
- key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
- restore-keys: |
- ${{ runner.os }}-yarn-
+ version: 8
- - uses: actions/setup-node@v2
+ - uses: actions/setup-node@v3
with:
node-version: 18.x
+ cache: 'pnpm'
- - name: yarn install
- run: yarn
+ - run: pnpm install
env:
CI: true
- - name: Run test
- run: yarn test
+ - name: Run tests
+ run: pnpm test
diff --git a/.nvmrc b/.nvmrc
deleted file mode 100644
index edf176c6..00000000
--- a/.nvmrc
+++ /dev/null
@@ -1 +0,0 @@
-v18.17
diff --git a/.prettierignore b/.prettierignore
new file mode 100644
index 00000000..12e5e655
--- /dev/null
+++ b/.prettierignore
@@ -0,0 +1,3 @@
+.next
+dist
+build
diff --git a/.prettierrc b/.prettierrc
index e1f0e677..02ace502 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -1,7 +1,7 @@
{
- "semi": false,
- "singleQuote": true,
- "trailingComma": "none",
- "arrowParens": "avoid",
- "printWidth": 100
-}
\ No newline at end of file
+ "semi": false,
+ "singleQuote": true,
+ "trailingComma": "none",
+ "arrowParens": "avoid",
+ "printWidth": 100
+}
diff --git a/e2e/forced-theme.test.ts b/e2e/forced-theme.test.ts
deleted file mode 100644
index 592f474a..00000000
--- a/e2e/forced-theme.test.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-import { test} from '@playwright/test'
-import { checkAppliedTheme, checkStoredTheme, makeBrowserContext } from './util'
-
-test.describe('forced theme test-suite', async () => {
- function makeForcedThemeTest(pageUrl: string, storedTheme: string, expectedTheme: string) {
- test(
- `should render forced-theme (${expectedTheme}) instead of stored theme (${expectedTheme})`,
- async ({ browser, baseURL}) => {
- const context = await makeBrowserContext(browser, {
- baseURL,
- localStorage: [{ name: 'theme', value: storedTheme }]
- })
- const page = await context.newPage()
- await page.goto(pageUrl)
-
- await checkStoredTheme(page, storedTheme)
- await checkAppliedTheme(page, expectedTheme)
- })
- }
-
- makeForcedThemeTest('/light', 'dark', 'light')
- makeForcedThemeTest('/dark', 'light', 'dark')
-})
diff --git a/e2e/switch-theme.test.ts b/e2e/switch-theme.test.ts
deleted file mode 100644
index 9f2c8742..00000000
--- a/e2e/switch-theme.test.ts
+++ /dev/null
@@ -1,44 +0,0 @@
-import { test} from '@playwright/test';
-import { checkAppliedTheme, makeBrowserContext } from './util';
-
-test.describe('basic theming test-suite', () => {
-
- function makeRenderThemeTest(theme: string) {
- test(`should render ${theme} theme`, async ({ browser, baseURL }) => {
- const context = await makeBrowserContext(browser, {
- baseURL,
- localStorage: [{ name: 'theme', value: theme }]
- });
- const page = await context.newPage()
-
- await page.goto('/');
- // Select dark
- await page.locator('[data-test-id="theme-selector"]').selectOption(theme);
- // Check if dark theme is applied
- await checkAppliedTheme(page, theme);
- });
- }
-
- makeRenderThemeTest('light');
- makeRenderThemeTest('dark');
-
- function shouldUpdateTheme(initialTheme, targetTheme: string) {
- test(`should switch from ${initialTheme} to ${targetTheme}-theme`, async ({ browser, baseURL }) => {
- const context = await makeBrowserContext(browser, {
- baseURL,
- localStorage: [{ name: 'theme', value: initialTheme }]
- });
- const page = await context.newPage()
-
- await page.goto('/');
- await checkAppliedTheme(page, initialTheme);
- // Select dark
- await page.locator('[data-test-id="theme-selector"]').selectOption(targetTheme);
- // Check if dark theme is applied
- await checkAppliedTheme(page, targetTheme);
- });
- }
-
- shouldUpdateTheme('light', 'dark');
- shouldUpdateTheme('dark', 'light');
-})
\ No newline at end of file
diff --git a/e2e/system-theme.test.ts b/e2e/system-theme.test.ts
deleted file mode 100644
index a724d5eb..00000000
--- a/e2e/system-theme.test.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import { test, expect } from '@playwright/test'
-import { checkAppliedTheme, checkStoredTheme, makeBrowserContext } from './util'
-
-test.describe('system theme test-suite', () => {
-
- function testSystemTheme(
- pagePath: string,
- preferredColorScheme: 'light' | 'dark',
- expectedTheme: string
- ) {
- test(`should render ${expectedTheme} theme if preferred-colorscheme is ${preferredColorScheme}`, async ({ browser, baseURL }) => {
- const context = await makeBrowserContext(browser, {
- colorScheme: preferredColorScheme,
- baseURL,
- localStorage: [{ name: 'theme', value: 'system' }]
- })
-
- const page = await context.newPage()
- await page.goto(pagePath)
-
- await checkStoredTheme(page, 'system')
- await checkAppliedTheme(page, expectedTheme)
- })
- }
-
- // Test if preferred-colorscheme works
- testSystemTheme('/', 'light', 'light')
- testSystemTheme('/', 'dark', 'dark')
-})
diff --git a/e2e/util.ts b/e2e/util.ts
deleted file mode 100644
index bc87bbee..00000000
--- a/e2e/util.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-import { Page, expect, Browser } from '@playwright/test'
-
-export async function checkAppliedTheme(page: Page,theme: string) {
- expect(
- await page.evaluate(() => document.documentElement.getAttribute('data-theme'))
- ).toBe(theme);
- expect(
- await page.evaluate(() => document.documentElement.getAttribute('style'))
- ).toBe(`color-scheme: ${theme};`);
-}
-
-export async function checkStoredTheme(page: Page, expectedTheme: string) {
- const localStorage = await page.evaluate(() => window.localStorage)
- expect(localStorage?.theme).toBe(expectedTheme)
-}
-
-type MakeBrowserContextOptions = {
- baseURL?: string,
- colorScheme?: 'light' | 'dark' | 'no-preference',
- localStorage?: {name: string, value: string}[]
-}
-
-export async function makeBrowserContext(browser: Browser, options: MakeBrowserContextOptions) {
- return await browser.newContext({
- colorScheme: options.colorScheme ?? 'no-preference',
- storageState: {
- cookies: [],
- origins: [
- {
- origin: options.baseURL ?? 'http://localhost:3000',
- localStorage: options.localStorage ?? [],
- }
- ]
- }
- })
-}
\ No newline at end of file
diff --git a/examples/example/package.json b/examples/example/package.json
index a564750a..10f47c5b 100644
--- a/examples/example/package.json
+++ b/examples/example/package.json
@@ -1,17 +1,15 @@
{
"name": "example",
"version": "1.0.0",
- "main": "index.js",
- "license": "MIT",
"scripts": {
"dev": "next",
"build": "next build",
"start": "next start"
},
"dependencies": {
- "next": "^12.1.6",
- "next-themes": "*",
- "react": "^18.1.0",
- "react-dom": "^18.1.0"
+ "next": "12.2.2",
+ "next-themes": "workspace:*",
+ "react": "18.2.0",
+ "react-dom": "18.2.0"
}
-}
\ No newline at end of file
+}
diff --git a/examples/example/pages/index.js b/examples/example/pages/index.js
index 5f9c6fd3..0b318c16 100644
--- a/examples/example/pages/index.js
+++ b/examples/example/pages/index.js
@@ -10,7 +10,7 @@ const Index = () => {
return (
next-themes Example
-