reactive-route 0.0.1-alpha.25 → 0.0.1-alpha.27

package/dist/vue/Router.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Router.d.ts","sourceRoot":"","sources":["../../packages/vue/Router.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,MAAM;;kPAoHjB,CAAC"}

package/dist/vue/index.d.ts

@@ -0,0 +1,2 @@
+export { Router } from './Router';
+//# sourceMappingURL=index.d.ts.map

package/dist/vue/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/vue/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC"}

package/e2e/app.test.ts

@@ -0,0 +1,130 @@
+import { expect, test } from '@playwright/test';
+
+const h1 = 'h1';
+
+test.describe('App routing E2E', () => {
+  test('home redirects to /static', async ({ page }) => {
+    await page.goto('/');
+    await page.waitForLoadState('networkidle');
+    await expect(page).toHaveURL('/static');
+
+    await expect(page.locator(h1)).toHaveText('Static Page');
+  });
+
+  test('redirect from /static to /page/example works', async ({ page }) => {
+    await page.goto('/static');
+    await page.waitForLoadState('networkidle');
+    await expect(page).toHaveURL('/static');
+
+    await expect(page.locator(h1)).toHaveText('Static Page');
+
+    await page.getByText('Go to Dynamic Page').click();
+    await page.waitForLoadState('networkidle');
+    await expect(page).toHaveURL('/page/example');
+
+    await expect(page.locator(h1)).toHaveText('Dynamic Page');
+  });
+
+  test('dynamic route with valid param renders and shows params', async ({ page }) => {
+    await page.goto('/page/example');
+    await page.waitForLoadState('networkidle');
+    await expect(page).toHaveURL('/page/example');
+
+    const preLocator = page.locator('.dynamic-page pre').nth(1);
+
+    await expect(page.locator(h1)).toHaveText('Dynamic Page');
+    await expect(preLocator).toContainText('"foo": "example"');
+
+    await page.getByText('Go to random dynamic value').click();
+
+    const randomFoo = ((await preLocator.textContent()) || '').match(/foo": "(\d+)"/)?.[1];
+
+    await expect(preLocator).toContainText(`"foo": "${randomFoo}"`);
+    await expect(page).toHaveURL(`/page/${randomFoo}`);
+  });
+
+  test('redirect from /static to /query works', async ({ page }) => {
+    await page.goto('/static');
+    await page.waitForLoadState('networkidle');
+    await expect(page).toHaveURL('/static');
+
+    await expect(page.locator(h1)).toHaveText('Static Page');
+
+    await page.getByText('Go to Query Page').click();
+    await page.waitForLoadState('networkidle');
+    await expect(page).toHaveURL('/query?foo=example');
+
+    await expect(page.locator(h1)).toHaveText('Query Page');
+  });
+
+  test('query route shows params', async ({ page }) => {
+    await page.goto('/query?foo=1');
+    await page.waitForLoadState('networkidle');
+    await expect(page).toHaveURL('/query');
+
+    const preLocator = page.locator('.query-page pre').nth(1);
+
+    await expect(page.locator(h1)).toHaveText('Query Page');
+    await expect(preLocator).toContainText('{}');
+
+    await page.getByText('Go to random query value').click();
+
+    const randomFoo = ((await preLocator.textContent()) || '').match(/foo": "(\d+)"/)?.[1];
+
+    await expect(preLocator).toContainText(`"foo": "${randomFoo}"`);
+    await expect(page).toHaveURL(`/query?foo=${randomFoo}`);
+
+    await page.goto('/query?foo=bar');
+    await page.waitForLoadState('networkidle');
+    await expect(page).toHaveURL('/query?foo=bar');
+  });
+
+  test('invalid routes redirect to 404', async ({ page }) => {
+    await page.goto('/page/ab');
+    await page.waitForLoadState('networkidle');
+
+    await expect(page.locator('.error-code')).toHaveText('404');
+    await expect(page.locator(h1)).toHaveText('Page Not Found');
+    await expect(page).toHaveURL('/error404');
+
+    await page.goto('/ab');
+    await page.waitForLoadState('networkidle');
+
+    await expect(page.locator('.error-code')).toHaveText('404');
+    await expect(page.locator(h1)).toHaveText('Page Not Found');
+    await expect(page).toHaveURL('/error404');
+  });
+
+  test('prevent: coming from Dynamic to Prevent redirects to Static (beforeEnter)', async ({
+    page,
+  }) => {
+    await page.goto('/page/example');
+    await page.waitForLoadState('networkidle');
+
+    await expect(page.locator(h1)).toHaveText('Dynamic Page');
+
+    await page
+      .getByRole('button', { name: 'Go to Prevent Page (will redirect to Static)' })
+      .click();
+    await page.waitForLoadState('networkidle');
+
+    await expect(page.locator(h1)).toHaveText('Static Page');
+    await expect(page).toHaveURL('/static');
+  });
+
+  test('prevent: from Prevent trying to go to Query is blocked (beforeLeave) and URL remains the same', async ({
+    page,
+  }) => {
+    await page.goto('/prevent');
+    await page.waitForLoadState('networkidle');
+
+    await expect(page.locator(h1)).toHaveText('Prevent Redirect Page');
+
+    await page.getByRole('button', { name: 'Try to go to Query Page (will be blocked)' }).click();
+
+    await page.waitForTimeout(100);
+
+    await expect(page.locator(h1)).toHaveText('Prevent Redirect Page');
+    await expect(page).toHaveURL('/prevent');
+  });
+});

package/e2e/teardown.ts

@@ -0,0 +1,12 @@
+import fs from 'node:fs';
+import path from 'node:path';
+
+export default function teardown() {
+  fs.readdirSync(path.resolve('examples')).map((project) =>
+    fs
+      .readdirSync(path.resolve('examples', project))
+      .filter((folderName) => folderName.startsWith('dist'))
+      .map((folderName) => path.resolve('examples', project, folderName))
+      .forEach((folderPath) => fs.rmSync(folderPath, { recursive: true, force: true }))
+  );
+}

package/package.json

@@ -2,7 +2,7 @@
   "name": "reactive-route",
   "author": "Dmitry Kazakov",
   "license": "MIT",
-  "version": "0.0.1-alpha.25",
+  "version": "0.0.1-alpha.27",
   "description": "Reactive Router for different frameworks",
   "repository": {
     "type": "git",
@@ -11,8 +11,6 @@
   "scripts": {
     "upd": "rm -rf ./node_modules&&pnpm i --prefer-offline",
     "build": "rm -rf ./dist&&node --import tsx ./scripts/build.ts&&tsc -b ./tsconfig.types.react.json&&tsc -b ./tsconfig.types.solid.json",
-    "test": "vitest run&&node --import tsx ./scripts/genCoverageBadge.ts",
-    "test-watch": "vitest --coverage=false",
     "npm-publish": "pnpm run build&&pnpm run test&&npm publish --access public",
     "analyze:js": "biome check --no-errors-on-unmatched .",
     "format:js": "biome check --no-errors-on-unmatched --write",
@@ -20,57 +18,74 @@
     "check-types-example": "tsc --project examples/react/tsconfig.json",
     "prepare": "husky",
     "upgrade-examples": "pnpm upgrade -r reactive-route@latest",
-    "docs:dev": "vitepress dev docs",
-    "docs:build": "vitepress build docs",
-    "docs:preview": "vitepress preview docs"
+    "upgrade-lib": "bash -c 'pnpm upgrade -r $@' bash",
+    "test": "vitest run&&node --import tsx ./scripts/genCoverageBadge.ts",
+    "test-watch": "vitest --coverage=false",
+    "e2e": "playwright test",
+    "e2e:ui": "playwright test --ui",
+    "e2e:install": "playwright install --with-deps",
+    "docs:dev": "vitepress dev vitepress",
+    "docs:build": "vitepress build vitepress --outDir docs",
+    "docs:preview": "vitepress preview vitepress"
   },
   "lint-staged": {
     "(*.js|*.ts|*.tsx|*.mjs)": [
       "pnpm run format:js"
     ]
   },
+  "resolutions": {
+    "@mongodb-js/zstd": "2.0.1"
+  },
   "dependencies": {
     "history": "5.3.0"
   },
   "devDependencies": {
-    "@types/babel__core": "7.20.5",
     "@babel/core": "7.28.4",
     "@babel/preset-env": "7.28.3",
     "@babel/preset-typescript": "7.27.1",
-    "babel-preset-solid": "1.9.9",
-    "vite-plugin-babel": "1.3.2",
-    "@biomejs/biome": "2.2.2",
-    "@espcom/esbuild-plugin-replace": "1.3.1",
+    "@biomejs/biome": "2.2.5",
     "@espcom/esbuild-plugin-compress": "1.2.0",
+    "@espcom/esbuild-plugin-replace": "1.3.2",
+    "playwright": "1.56.1",
+    "@playwright/test": "1.56.1",
+    "@preact/preset-vite": "2.10.2",
     "@solidjs/testing-library": "0.8.10",
-    "@testing-library/react": "16.3.0",
     "@testing-library/preact": "3.2.4",
-    "@types/lodash": "4.17.16",
-    "@types/node": "22.14.1",
+    "@testing-library/react": "16.3.0",
+    "@testing-library/vue": "8.1.0",
+    "@types/babel__core": "7.20.5",
+    "@types/lodash": "4.17.20",
+    "@types/node": "24.7.2",
+    "@vitejs/plugin-vue": "6.0.1",
     "@vitest/coverage-istanbul": "3.2.4",
-    "vite-tsconfig-paths": "5.1.4",
-    "@preact/preset-vite": "2.10.2",
+    "@vue/test-utils": "2.4.6",
+    "babel-preset-solid": "1.9.9",
     "badge-maker": "5.0.2",
-    "esbuild": "0.25.10",
+    "esbuild": "0.25.11",
     "husky": "9.1.7",
-    "kr-observable": "3.1.4",
-    "lint-staged": "16.1.6",
+    "kr-observable": "3.1.9",
+    "lint-staged": "16.2.4",
     "lodash": "4.17.21",
-    "mobx": "6.13.7",
+    "mobx": "6.15.0",
     "mobx-preact": "3.0.0",
-    "mobx-react-lite": "4.1.0",
-    "react": "19.1.1",
+    "mobx-react-lite": "4.1.1",
     "preact": "10.27.2",
     "preact-render-to-string": "6.6.1",
+    "react": "19.1.1",
     "solid-js": "1.9.9",
-    "tsx": "4.20.5",
+    "tsx": "4.20.6",
     "typescript": "5.9.2",
+    "vite-plugin-babel": "1.3.2",
+    "vite-tsconfig-paths": "5.1.4",
     "vitepress": "2.0.0-alpha.12",
-    "vitepress-plugin-group-icons": "1.6.3",
+    "vitepress-plugin-group-icons": "1.6.4",
     "vitest": "3.2.4",
+    "vue": "3.5.22",
     "xml-splitter": "1.2.1"
   },
-  "packageManager": "pnpm@10.9.0",
+  "engines": {
+    "node": ">=22"
+  },
   "exports": {
     ".": {
       "types": "./dist/core/index.d.ts",
@@ -92,6 +107,16 @@
       "require": "./dist/cjs/solid/index.js",
       "import": "./dist/esm/solid/index.js"
     },
+    "./vue": {
+      "types": "./dist/vue/index.d.ts",
+      "require": "./dist/cjs/vue/index.js",
+      "import": "./dist/esm/vue/index.js"
+    },
+    "./adapters/vue": {
+      "types": "./dist/adapters/vue.d.ts",
+      "require": "./dist/cjs/adapters/vue/index.js",
+      "import": "./dist/esm/adapters/vue/index.js"
+    },
     "./adapters/mobx-react": {
       "types": "./dist/adapters/mobx-react.d.ts",
       "require": "./dist/cjs/adapters/mobx-react/index.js",
@@ -131,4 +156,4 @@
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/core/index.d.ts"
-}
+}

package/playwright.config.ts

@@ -0,0 +1,52 @@
+import { defineConfig, devices } from '@playwright/test';
+
+const csrVariants: Array<{ name: string; scriptName: string }> = [
+  { name: '[React+Mobx]', scriptName: './examples/react mobx' },
+  { name: '[React+Observable]', scriptName: './examples/react observable' },
+  { name: '[Preact+Mobx]', scriptName: './examples/preact mobx' },
+  { name: '[Preact+Observable]', scriptName: './examples/preact observable' },
+  { name: '[Solid+Mobx]', scriptName: './examples/solid mobx' },
+  { name: '[Solid+Observable]', scriptName: './examples/solid observable' },
+  { name: '[Solid+Solid]', scriptName: './examples/solid solid' },
+];
+
+const ssrVariants: Array<{ name: string; scriptName: string }> = [
+  { name: '[React+Mobx+SSR]', scriptName: './examples/react ssr-mobx' },
+  { name: '[React+Observable+SSR]', scriptName: './examples/react ssr-observable' },
+  { name: '[Preact+Mobx+SSR]', scriptName: './examples/preact ssr-mobx' },
+  { name: '[Preact+Observable+SSR]', scriptName: './examples/preact ssr-observable' },
+  { name: '[Solid+Mobx+SSR]', scriptName: './examples/solid ssr-mobx' },
+  { name: '[Solid+Observable+SSR]', scriptName: './examples/solid ssr-observable' },
+  { name: '[Solid+Solid+SSR]', scriptName: './examples/solid ssr-solid' },
+];
+
+const variants: Array<{ name: string; port: number; scriptName: string }> = [
+  ...csrVariants,
+  ...ssrVariants,
+].map((variant, i) => ({ ...variant, port: 8002 + i * 2 }));
+
+export default defineConfig({
+  testDir: './e2e',
+  fullyParallel: true,
+  forbidOnly: false,
+  retries: 0,
+  // workers: 10,
+  reporter: [['list']],
+  webServer: variants.map((variant) => ({
+    name: variant.name,
+    command: `pnpm --filter ${variant.scriptName} ${variant.port} test`,
+    port: variant.port,
+    reuseExistingServer: false,
+    timeout: 10000,
+    cwd: __dirname,
+    stdout: 'pipe',
+  })),
+  projects: variants.map((variant) => ({
+    name: variant.name,
+    use: {
+      baseURL: `http://localhost:${variant.port}`,
+      ...devices['Desktop Chrome'],
+    },
+  })),
+  globalTeardown: require.resolve('./e2e/teardown'),
+});

package/vitepress/.vitepress/cache/deps/_metadata.json

@@ -0,0 +1,52 @@
+{
+  "hash": "5a633cf9",
+  "configHash": "c2aca7c2",
+  "lockfileHash": "81207e34",
+  "browserHash": "ffb49e63",
+  "optimized": {
+    "vue": {
+      "src": "../../../../node_modules/.pnpm/vue@3.5.22_typescript@5.9.2/node_modules/vue/dist/vue.runtime.esm-bundler.js",
+      "file": "vue.js",
+      "fileHash": "acc43dc7",
+      "needsInterop": false
+    },
+    "vitepress > @vue/devtools-api": {
+      "src": "../../../../node_modules/.pnpm/@vue+devtools-api@8.0.1/node_modules/@vue/devtools-api/dist/index.js",
+      "file": "vitepress___@vue_devtools-api.js",
+      "fileHash": "f6e97e3d",
+      "needsInterop": false
+    },
+    "vitepress > @vueuse/core": {
+      "src": "../../../../node_modules/.pnpm/@vueuse+core@13.9.0_vue@3.5.22_typescript@5.9.2_/node_modules/@vueuse/core/index.mjs",
+      "file": "vitepress___@vueuse_core.js",
+      "fileHash": "10a3e7ca",
+      "needsInterop": false
+    },
+    "vitepress > @vueuse/integrations/useFocusTrap": {
+      "src": "../../../../node_modules/.pnpm/@vueuse+integrations@13.9.0_focus-trap@7.6.5_vue@3.5.22_typescript@5.9.2_/node_modules/@vueuse/integrations/useFocusTrap.mjs",
+      "file": "vitepress___@vueuse_integrations_useFocusTrap.js",
+      "fileHash": "a8fdd658",
+      "needsInterop": false
+    },
+    "vitepress > mark.js/src/vanilla.js": {
+      "src": "../../../../node_modules/.pnpm/mark.js@8.11.1/node_modules/mark.js/src/vanilla.js",
+      "file": "vitepress___mark__js_src_vanilla__js.js",
+      "fileHash": "be042848",
+      "needsInterop": false
+    },
+    "vitepress > minisearch": {
+      "src": "../../../../node_modules/.pnpm/minisearch@7.1.2/node_modules/minisearch/dist/es/index.js",
+      "file": "vitepress___minisearch.js",
+      "fileHash": "f4e7a04e",
+      "needsInterop": false
+    }
+  },
+  "chunks": {
+    "chunk-VGAXUAUJ": {
+      "file": "chunk-VGAXUAUJ.js"
+    },
+    "chunk-FL23S3EK": {
+      "file": "chunk-FL23S3EK.js"
+    }
+  }
+}