diff --git a/test/custom-elements/index.js b/test/custom-elements/index.js
index 60d276dbf2..7580ba6b4e 100644
--- a/test/custom-elements/index.js
+++ b/test/custom-elements/index.js
@@ -1,73 +1,49 @@
+import { chromium } from '@playwright/test';
+import virtual from '@rollup/plugin-virtual';
+import { deepStrictEqual } from 'assert';
import * as fs from 'fs';
-import * as path from 'path';
import * as http from 'http';
+import * as path from 'path';
import { rollup } from 'rollup';
-import virtual from '@rollup/plugin-virtual';
-import puppeteer from 'puppeteer';
-import { addLineNumbers, loadConfig, loadSvelte, retryAsync, executeBrowserTest } from '../helpers';
-import { deepEqual } from 'assert';
+import { loadConfig, loadSvelte } from '../helpers';
-const page = `
+/**
+ * @param {string} id
+ * @returns
+ */
+const page_content = (id, code) => `
-
+
`;
const assert = fs.readFileSync(`${__dirname}/assert.js`, 'utf-8');
describe('custom-elements', function () {
- // Note: Increase the timeout in preparation for restarting Chromium due to SIGSEGV.
this.timeout(10000);
+
let svelte;
- let server;
+ /** @type {import('@playwright/test').Browser} */
let browser;
- let code;
- function create_server() {
- return new Promise((fulfil, reject) => {
- const server = http.createServer((req, res) => {
- if (req.url === '/') {
- res.end(page);
- }
-
- if (req.url === '/bundle.js') {
- res.end(code);
- }
- });
-
- server.on('error', reject);
-
- server.listen('6789', () => {
- fulfil(server);
- });
- });
- }
-
- async function launchPuppeteer() {
- return await retryAsync(() => puppeteer.launch());
+ async function launchBrowser() {
+ return await chromium.launch();
}
before(async () => {
svelte = loadSvelte();
console.log('[custom-element] Loaded Svelte');
- server = await create_server();
- console.log('[custom-element] Started server');
- browser = await launchPuppeteer();
- console.log('[custom-element] Launched puppeteer browser');
+ browser = await launchBrowser();
+ console.log('[custom-element] Launched playwright browser');
});
after(async () => {
- if (server) server.close();
if (browser) await browser.close();
});
fs.readdirSync(`${__dirname}/samples`).forEach((dir) => {
if (dir[0] === '.') return;
- // MEMO: puppeteer can not execute Chromium properly with Node8,10 on Linux at GitHub actions.
- const { version } = process;
- if ((version.startsWith('v8.') || version.startsWith('v10.')) && process.platform === 'linux')
- return;
const solo = /\.solo$/.test(dir);
const skip = /\.skip$/.test(dir);
@@ -114,12 +90,11 @@ describe('custom-elements', function () {
]
});
- const result = await bundle.generate({ format: 'iife', name: 'test' });
- code = result.output[0].code;
+ const generated_bundle = await bundle.generate({ format: 'iife', name: 'test' });
function assertWarnings() {
if (expected_warnings) {
- deepEqual(
+ deepStrictEqual(
warnings.map((w) => ({
code: w.code,
message: w.message,
@@ -132,10 +107,18 @@ describe('custom-elements', function () {
}
}
- browser = await executeBrowserTest(browser, launchPuppeteer, assertWarnings, () => {
- console.log(addLineNumbers(code));
- assertWarnings();
+ const page = await browser.newPage();
+ page.on('console', (type) => {
+ console[type.type()](type.text());
});
+
+ await page.setContent(page_content(dir, generated_bundle.output[0].code));
+ await page.waitForFunction('typeof test !== "undefined"');
+ const test_result = await page.evaluate(`test(document.querySelector('main'))`);
+
+ if (test_result) console.log(test_result);
+ assertWarnings();
+ await page.close();
});
});
});
diff --git a/test/custom-elements/samples/no-missing-prop-warnings/test.js b/test/custom-elements/samples/no-missing-prop-warnings/test.js
index f03d1787b8..cc62dab2fd 100644
--- a/test/custom-elements/samples/no-missing-prop-warnings/test.js
+++ b/test/custom-elements/samples/no-missing-prop-warnings/test.js
@@ -2,6 +2,8 @@ import * as assert from 'assert';
import { tick } from 'svelte';
import './main.svelte';
+console.log('ello');
+
export default async function (target) {
const warnings = [];
const warn = console.warn;
diff --git a/test/helpers.js b/test/helpers.js
index db0f135945..c4eee6f433 100644
--- a/test/helpers.js
+++ b/test/helpers.js
@@ -370,7 +370,7 @@ export async function executeBrowserTest(browser, launchPuppeteer, additionalAss
console[type.type()](type.text());
});
- page.on('error', (error) => {
+ page.on('pageerror', (error) => {
console.log('>>> an error happened');
console.error(error);
});
diff --git a/test/test.js b/test/test.js
index b6998943c2..6944d97c58 100644
--- a/test/test.js
+++ b/test/test.js
@@ -9,7 +9,7 @@ require('../internal');
console.clear();
const test_folders = glob('*/index.js', { cwd: 'test' });
-const solo_folders = test_folders.filter((folder) => /\.solo/.test(folder));
+const solo_folders = test_folders.filter((folder) => /custom-elements/.test(folder));
if (solo_folders.length) {
if (process.env.CI) {