chore: move playwright gallery into a subfolder (#13695)
This commit is contained in:
Pavel Feldman
GitHub
parent
801dbe0699
commit
3d4caab153
|
|
@ -67,7 +67,7 @@ npm run test
|
|||
<style>@import '/src/assets/base.css';</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/tests.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<style>@import '/src/assets/base.css';</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/tests.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -28,13 +28,13 @@ const config: PlaywrightTestConfig = {
|
|||
['html', { open: 'on-failure' }]
|
||||
],
|
||||
webServer: {
|
||||
url: 'http://localhost:3101/playwright.html',
|
||||
url: 'http://localhost:3101/playwright/index.html',
|
||||
command: 'npm run playwright-dev',
|
||||
cwd: __dirname,
|
||||
reuseExistingServer: !process.env.CI,
|
||||
},
|
||||
use: {
|
||||
baseURL: 'http://localhost:3101/playwright.html',
|
||||
baseURL: 'http://localhost:3101/playwright/index.html',
|
||||
trace: 'on-first-retry',
|
||||
},
|
||||
projects: [ ],
|
||||
|
|
|
|||
|
|
@ -16,16 +16,14 @@
|
|||
|
||||
import { defineConfig } from 'vite';
|
||||
import react from '@vitejs/plugin-react';
|
||||
import playwrightPlugin from '@playwright/experimental-ct-react/vitePlugin';
|
||||
import playwright from '@playwright/experimental-ct-react/vitePlugin';
|
||||
import path from 'path';
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
react(),
|
||||
playwrightPlugin({
|
||||
imports: ['./src/theme.css']
|
||||
}),
|
||||
playwright(),
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
|
|
|
|||
|
|
@ -24,6 +24,6 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id='root'></div>
|
||||
<script type='module' src='/playwright.app.ts'></script>
|
||||
<script type='module' src='/playwright/index.ts'></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -14,4 +14,4 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
|
||||
// Playwright's Vite plugin is dynamically populating this file with the components.
|
||||
import '../src/theme.css';
|
||||
|
|
@ -14,4 +14,4 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
|
||||
export default function(options?: { include?: string, imports?: string[] }): any;
|
||||
export default function(options?: { include?: string }): any;
|
||||
|
|
|
|||
|
|
@ -41,11 +41,11 @@ const playwrightMount = component => {
|
|||
throw new Error(`Unregistered component: ${component.type}. Following components are registered: ${[...registry.keys()]}`);
|
||||
|
||||
const wrapper = new componentCtor({
|
||||
target: document.getElementById('app'),
|
||||
target: document.getElementById('root'),
|
||||
props: component.options?.props,
|
||||
});
|
||||
|
||||
for (const [key, listener] of Object.entries(component.options?.on || {}))
|
||||
wrapper.$on(key, event => listener(event.detail));
|
||||
return '#app > *';
|
||||
return '#root > *';
|
||||
};
|
||||
|
|
|
|||
|
|
@ -14,4 +14,4 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
|
||||
export default function(options?: { include?: string, imports?: string[] }): any;
|
||||
export default function(options?: { include?: string }): any;
|
||||
|
|
|
|||
|
|
@ -129,6 +129,6 @@ window.playwrightMount = async component => {
|
|||
render: () => render(component)
|
||||
});
|
||||
instance.setDevtoolsHook(createDevTools(), {});
|
||||
app.mount('#app');
|
||||
return '#app > *';
|
||||
app.mount('#root');
|
||||
return '#root > *';
|
||||
};
|
||||
|
|
|
|||
|
|
@ -14,4 +14,4 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
|
||||
export default function(options?: { include?: string, imports?: string[] }): any;
|
||||
export default function(options?: { include?: string }): any;
|
||||
|
|
|
|||
|
|
@ -23,20 +23,18 @@ import { componentInfo, collectComponentUsages } from './tsxTransform';
|
|||
import type { ComponentInfo } from './tsxTransform';
|
||||
|
||||
const imports: Map<string, ComponentInfo> = new Map();
|
||||
let configDir: string;
|
||||
|
||||
export function createVitePlugin(registerFunction: string) {
|
||||
return (options?: { include: string, imports?: string[] }) => {
|
||||
return (options?: { include: string }) => {
|
||||
return vitePlugin({ ...(options || {}), registerFunction });
|
||||
};
|
||||
}
|
||||
|
||||
function vitePlugin(options: { include?: string, imports?: string[], registerFunction: string }): Plugin {
|
||||
function vitePlugin(options: { include?: string, registerFunction: string }): Plugin {
|
||||
return {
|
||||
name: 'playwright-gallery',
|
||||
|
||||
configResolved: async config => {
|
||||
configDir = path.dirname(config.configFile || '');
|
||||
const files = await new Promise<string[]>((f, r) => {
|
||||
glob(options.include || config.root + '/**/*.{test,spec}.[tj]s{x,}', {}, function(err, files) {
|
||||
if (err)
|
||||
|
|
@ -72,12 +70,12 @@ function vitePlugin(options: { include?: string, imports?: string[], registerFun
|
|||
}
|
||||
},
|
||||
|
||||
transform: async (_, id) => {
|
||||
if (!id.includes('playwright.app.ts') && !id.includes('playwright.app.js'))
|
||||
transform: async (content, id) => {
|
||||
if (!id.endsWith('playwright/index.ts') && !id.endsWith('playwright/index.tsx') && !id.endsWith('playwright/index.js'))
|
||||
return;
|
||||
|
||||
const folder = path.dirname(id);
|
||||
const lines = [];
|
||||
const lines = [content, ''];
|
||||
lines.push(`import register from '${options.registerFunction}';`);
|
||||
|
||||
for (const [alias, value] of imports) {
|
||||
|
|
@ -88,11 +86,6 @@ function vitePlugin(options: { include?: string, imports?: string[], registerFun
|
|||
lines.push(`import ${alias} from '${importPath}';`);
|
||||
}
|
||||
|
||||
for (const i of options.imports || []) {
|
||||
const importPath = configDir && i.startsWith('.') ? './' + path.relative(folder, path.resolve(configDir, i)).replace(/\\/g, '/') : i;
|
||||
lines.push(`import '${importPath}';`);
|
||||
}
|
||||
|
||||
lines.push(`register({ ${[...imports.keys()].join(',\n ')} });`);
|
||||
return lines.join('\n');
|
||||
},
|
||||
|
|
|
|||
|
|
@ -27,13 +27,13 @@ const config: PlaywrightTestConfig = {
|
|||
['html', { open: 'on-failure' }]
|
||||
],
|
||||
webServer: {
|
||||
url: 'http://localhost:3102/playwright.html',
|
||||
url: 'http://localhost:3102/playwright/index.html',
|
||||
command: 'npx vite --config playwright.vite.config.ts dev',
|
||||
cwd: __dirname,
|
||||
reuseExistingServer: !process.env.CI,
|
||||
},
|
||||
use: {
|
||||
baseURL: 'http://localhost:3102/playwright.html',
|
||||
baseURL: 'http://localhost:3102/playwright/index.html',
|
||||
trace: 'on-first-retry',
|
||||
},
|
||||
projects: [
|
||||
|
|
|
|||
|
|
@ -16,19 +16,13 @@
|
|||
|
||||
import { defineConfig } from 'vite';
|
||||
import react from '@vitejs/plugin-react';
|
||||
import playwrightPlugin from '@playwright/experimental-ct-react/vitePlugin';
|
||||
import playwright from '@playwright/experimental-ct-react/vitePlugin';
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
react(),
|
||||
playwrightPlugin({
|
||||
imports: [
|
||||
'./src/common.css',
|
||||
'./src/theme.ts',
|
||||
'./src/third_party/vscode/codicon.css',
|
||||
],
|
||||
}),
|
||||
playwright(),
|
||||
],
|
||||
server: {
|
||||
port: 3102,
|
||||
|
|
|
|||
|
|
@ -24,6 +24,6 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/playwright.app.ts"></script>
|
||||
<script type="module" src="/playwright/index.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -14,4 +14,6 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
|
||||
// Playwright's Vite plugin is dynamically populating this file with the components.
|
||||
import '../src/common.css';
|
||||
import '../src/theme.ts';
|
||||
import '../src/third_party/vscode/codicon.css';
|
||||
|
|
@ -1 +0,0 @@
|
|||
// Playwright's Vite plugin is dynamically populating this file with the components.
|
||||
|
|
@ -26,12 +26,12 @@ const config: PlaywrightTestConfig = {
|
|||
['html', { open: 'on-failure' }]
|
||||
],
|
||||
webServer: {
|
||||
url: 'http://localhost:3000/playwright.html',
|
||||
url: 'http://localhost:3000/playwright/index.html',
|
||||
command: 'npm run playwright-dev',
|
||||
reuseExistingServer: !process.env.CI,
|
||||
},
|
||||
use: {
|
||||
baseURL: 'http://localhost:3000/playwright.html',
|
||||
baseURL: 'http://localhost:3000/playwright/index.html',
|
||||
trace: 'on-first-retry',
|
||||
},
|
||||
projects: [
|
||||
|
|
|
|||
|
|
@ -1,13 +1,11 @@
|
|||
import { defineConfig } from 'vite';
|
||||
import react from '@vitejs/plugin-react';
|
||||
import playwrightPlugin from '@playwright/experimental-ct-react/vitePlugin';
|
||||
import playwright from '@playwright/experimental-ct-react/vitePlugin';
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
react(),
|
||||
playwrightPlugin({
|
||||
imports: ['./src/index.css']
|
||||
}),
|
||||
playwright(),
|
||||
]
|
||||
});
|
||||
|
|
|
|||
|
|
@ -8,6 +8,6 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/playwright.app.ts"></script>
|
||||
<script type="module" src="/playwright/index.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1 @@
|
|||
import '../src/index.css';
|
||||
|
|
@ -12,4 +12,4 @@ onMount(async () => {
|
|||
});
|
||||
</script>
|
||||
|
||||
<div id="app"></div>
|
||||
<div id="root"></div>
|
||||
|
|
|
|||
|
|
@ -1 +0,0 @@
|
|||
// Playwright's Vite plugin is dynamically populating this file with the components.
|
||||
|
|
@ -27,12 +27,12 @@ const config: PlaywrightTestConfig = {
|
|||
['html', { open: 'on-failure' }]
|
||||
],
|
||||
webServer: {
|
||||
url: 'http://localhost:3000/playwright.html',
|
||||
url: 'http://localhost:3000/playwright/index.html',
|
||||
command: 'npm run playwright-dev',
|
||||
reuseExistingServer: !process.env.CI,
|
||||
},
|
||||
use: {
|
||||
baseURL: 'http://localhost:3000/playwright.html',
|
||||
baseURL: 'http://localhost:3000/playwright/index.html',
|
||||
trace: 'on-first-retry',
|
||||
},
|
||||
projects: [
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
import { defineConfig } from 'vite'
|
||||
import { svelte } from '@sveltejs/vite-plugin-svelte'
|
||||
import playwrightPlugin from '@playwright/experimental-ct-svelte/vitePlugin';
|
||||
import playwright from '@playwright/experimental-ct-svelte/vitePlugin';
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
svelte(),
|
||||
playwrightPlugin(),
|
||||
playwright(),
|
||||
]
|
||||
})
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
<title>Svelte + TS + Vite App</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/playwright.app.ts"></script>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/playwright/index.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -14,6 +14,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<div id="root"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<div id="root"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1 +0,0 @@
|
|||
// Playwright's Vite plugin is dynamically populating this file with the components.
|
||||
|
|
@ -26,12 +26,12 @@ const config: PlaywrightTestConfig = {
|
|||
['html', { open: 'on-failure' }]
|
||||
],
|
||||
webServer: {
|
||||
url: 'http://localhost:3000/playwright.html',
|
||||
url: 'http://localhost:3000/playwright/index.html',
|
||||
command: 'npm run playwright-dev',
|
||||
reuseExistingServer: !process.env.CI,
|
||||
},
|
||||
use: {
|
||||
baseURL: 'http://localhost:3000/playwright.html',
|
||||
baseURL: 'http://localhost:3000/playwright/index.html',
|
||||
trace: 'on-first-retry',
|
||||
},
|
||||
projects: [
|
||||
|
|
|
|||
|
|
@ -1,18 +1,11 @@
|
|||
import { fileURLToPath, URL } from 'url'
|
||||
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import playwrightPlugin from '@playwright/experimental-ct-vue/vitePlugin';
|
||||
import playwright from '@playwright/experimental-ct-vue/vitePlugin';
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
vue(),
|
||||
playwrightPlugin(),
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||
}
|
||||
},
|
||||
playwright(),
|
||||
]
|
||||
})
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
<title>Vite App</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/playwright.app.js"></script>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/playwright/index.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue