From 38e40f1cc245d8a755e8b498632bab49680db0a4 Mon Sep 17 00:00:00 2001 From: Atharva Date: Wed, 31 Jan 2024 20:28:44 +0530 Subject: [PATCH] chore(`@astrojs/vue`): use Node.js for testing (#9901) * chore: migrate vue tests to node * chore: prune chai/mocha from package-lock --- packages/integrations/vue/package.json | 4 +- .../vue/test/app-entrypoint-css.test.js | 20 +++---- .../vue/test/app-entrypoint.test.js | 54 +++++++++---------- packages/integrations/vue/test/basics.test.js | 7 +-- pnpm-lock.yaml | 6 --- 5 files changed, 42 insertions(+), 49 deletions(-) diff --git a/packages/integrations/vue/package.json b/packages/integrations/vue/package.json index 242cf67c23..a2cd331ec4 100644 --- a/packages/integrations/vue/package.json +++ b/packages/integrations/vue/package.json @@ -37,7 +37,7 @@ "build": "astro-scripts build \"src/index.ts\" && astro-scripts build \"src/editor.cts\" --force-cjs --no-clean-dist && tsc", "build:ci": "astro-scripts build \"src/**/*.ts\" && astro-scripts build \"src/editor.cts\" --force-cjs --no-clean-dist", "dev": "astro-scripts dev \"src/**/*.ts\"", - "test": "mocha --timeout 20000" + "test": "astro-scripts test \"test/**/*.test.js\"" }, "dependencies": { "@vitejs/plugin-vue": "^4.5.0", @@ -49,10 +49,8 @@ "@types/chai": "^4.3.10", "astro": "workspace:*", "astro-scripts": "workspace:*", - "chai": "^4.3.7", "cheerio": "1.0.0-rc.12", "linkedom": "^0.16.4", - "mocha": "^10.2.0", "vite": "^5.0.12", "vue": "^3.3.8" }, diff --git a/packages/integrations/vue/test/app-entrypoint-css.test.js b/packages/integrations/vue/test/app-entrypoint-css.test.js index e454d6d0ed..6920083491 100644 --- a/packages/integrations/vue/test/app-entrypoint-css.test.js +++ b/packages/integrations/vue/test/app-entrypoint-css.test.js @@ -1,5 +1,6 @@ import { loadFixture } from './test-utils.js'; -import { expect } from 'chai'; +import * as assert from 'node:assert/strict'; +import { describe, it, before, after } from 'node:test'; import { load as cheerioLoad } from 'cheerio'; describe('App Entrypoint CSS', () => { @@ -22,18 +23,17 @@ describe('App Entrypoint CSS', () => { const $ = cheerioLoad(html); // test 1: basic component renders - expect($('#foo > #bar').text()).to.eq('works'); - + assert.equal($('#foo > #bar').text(), 'works'); // test 2: injects the global style on the page - expect($('style').first().text().trim()).to.eq(':root{background-color:red}'); + assert.equal($('style').first().text().trim(), ':root{background-color:red}'); }); it('does not inject styles to pages without a Vue component', async () => { const html = await fixture.readFile('/unrelated/index.html'); const $ = cheerioLoad(html); - expect($('style').length).to.eq(0); - expect($('link[rel="stylesheet"]').length).to.eq(0); + assert.equal($('style').length, 0); + assert.equal($('link[rel="stylesheet"]').length, 0); }); }); @@ -51,17 +51,17 @@ describe('App Entrypoint CSS', () => { const $ = cheerioLoad(html); // test 1: basic component renders - expect($('#foo > #bar').text()).to.eq('works'); + assert.equal($('#foo > #bar').text(), 'works'); // test 2: injects the global style on the page - expect($('style').first().text().replace(/\s+/g, '')).to.eq(':root{background-color:red;}'); + assert.equal($('style').first().text().replace(/\s+/g, ''), ':root{background-color:red;}'); }); it('does not inject styles to pages without a Vue component', async () => { const html = await fixture.fetch('/unrelated').then((res) => res.text()); const $ = cheerioLoad(html); - expect($('style').length).to.eq(0); - expect($('link[rel="stylesheet"]').length).to.eq(0); + assert.equal($('style').length, 0); + assert.equal($('link[rel="stylesheet"]').length, 0); }); }); }); diff --git a/packages/integrations/vue/test/app-entrypoint.test.js b/packages/integrations/vue/test/app-entrypoint.test.js index 04bfdf9dc0..5cdae3c049 100644 --- a/packages/integrations/vue/test/app-entrypoint.test.js +++ b/packages/integrations/vue/test/app-entrypoint.test.js @@ -1,5 +1,6 @@ import { loadFixture } from './test-utils.js'; -import { expect } from 'chai'; +import * as assert from 'node:assert/strict'; +import { describe, it, before, after } from 'node:test'; import { load as cheerioLoad } from 'cheerio'; import { parseHTML } from 'linkedom'; @@ -19,17 +20,17 @@ describe('App Entrypoint', () => { const $ = cheerioLoad(html); // test 1: basic component renders - expect($('#foo > #bar').text()).to.eq('works'); + assert.equal($('#foo > #bar').text(), 'works'); // test 2: component with multiple script blocks renders and exports // values from non setup block correctly - expect($('#multiple-script-blocks').text()).to.equal('2 4'); + assert.equal($('#multiple-script-blocks').text(), '2 4'); // test 3: component using generics renders - expect($('#generics').text()).to.equal('generic'); + assert.equal($('#generics').text(), 'generic'); // test 4: component using generics and multiple script blocks renders - expect($('#generics-and-blocks').text()).to.equal('1 3!!!'); + assert.equal($('#generics-and-blocks').text(), '1 3!!!'); }); it('setup included in renderer bundle', async () => { @@ -37,10 +38,10 @@ describe('App Entrypoint', () => { const { document } = parseHTML(data); const island = document.querySelector('astro-island'); const client = island.getAttribute('renderer-url'); - expect(client).not.to.be.undefined; + assert.notEqual(client, undefined); const js = await fixture.readFile(client); - expect(js).to.match(/\w+\.component\(\"Bar\"/gm); + assert.match(js, /\w+\.component\(\"Bar\"/gm); }); it('loads svg components without transforming them to assets', async () => { @@ -48,7 +49,7 @@ describe('App Entrypoint', () => { const { document } = parseHTML(data); const client = document.querySelector('astro-island svg'); - expect(client).not.to.be.undefined; + assert.notEqual(client, undefined); }); }); @@ -72,8 +73,8 @@ describe('App Entrypoint no export default (dev)', () => { const html = await fixture.fetch('/').then((res) => res.text()); const { document } = parseHTML(html); const bar = document.querySelector('#foo > #bar'); - expect(bar).not.to.be.undefined; - expect(bar.textContent).to.eq('works'); + assert.notEqual(bar, undefined); + assert.equal(bar.textContent, 'works'); }); it('loads svg components without transforming them to assets', async () => { @@ -81,7 +82,7 @@ describe('App Entrypoint no export default (dev)', () => { const { document } = parseHTML(html); const client = document.querySelector('astro-island svg'); - expect(client).not.to.be.undefined; + assert.notEqual(client, undefined); }); }); @@ -100,8 +101,8 @@ describe('App Entrypoint no export default', () => { const data = await fixture.readFile('/index.html'); const { document } = parseHTML(data); const bar = document.querySelector('#foo > #bar'); - expect(bar).not.to.be.undefined; - expect(bar.textContent).to.eq('works'); + assert.notEqual(bar, undefined); + assert.equal(bar.textContent, 'works'); }); it('component not included in renderer bundle', async () => { @@ -109,10 +110,9 @@ describe('App Entrypoint no export default', () => { const { document } = parseHTML(data); const island = document.querySelector('astro-island'); const client = island.getAttribute('renderer-url'); - expect(client).not.to.be.undefined; - + assert.notEqual(client, undefined); const js = await fixture.readFile(client); - expect(js).not.to.match(/\w+\.component\(\"Bar\"/gm); + assert.doesNotMatch(js, /\w+\.component\(\"Bar\"/gm); }); it('loads svg components without transforming them to assets', async () => { @@ -120,7 +120,7 @@ describe('App Entrypoint no export default', () => { const { document } = parseHTML(data); const client = document.querySelector('astro-island svg'); - expect(client).not.to.be.undefined; + assert.notEqual(client, undefined); }); }); @@ -139,8 +139,8 @@ describe('App Entrypoint relative', () => { const data = await fixture.readFile('/index.html'); const { document } = parseHTML(data); const bar = document.querySelector('#foo > #bar'); - expect(bar).not.to.be.undefined; - expect(bar.textContent).to.eq('works'); + assert.notEqual(bar, undefined); + assert.equal(bar.textContent, 'works'); }); it('component not included in renderer bundle', async () => { @@ -148,10 +148,10 @@ describe('App Entrypoint relative', () => { const { document } = parseHTML(data); const island = document.querySelector('astro-island'); const client = island.getAttribute('renderer-url'); - expect(client).not.to.be.undefined; + assert.notEqual(client, undefined); const js = await fixture.readFile(client); - expect(js).not.to.match(/\w+\.component\(\"Bar\"/gm); + assert.doesNotMatch(js, /\w+\.component\(\"Bar\"/gm); }); }); @@ -170,8 +170,8 @@ describe('App Entrypoint /src/absolute', () => { const data = await fixture.readFile('/index.html'); const { document } = parseHTML(data); const bar = document.querySelector('#foo > #bar'); - expect(bar).not.to.be.undefined; - expect(bar.textContent).to.eq('works'); + assert.notEqual(bar, undefined); + assert.equal(bar.textContent, 'works'); }); it('component not included in renderer bundle', async () => { @@ -179,10 +179,10 @@ describe('App Entrypoint /src/absolute', () => { const { document } = parseHTML(data); const island = document.querySelector('astro-island'); const client = island.getAttribute('renderer-url'); - expect(client).not.to.be.undefined; + assert.notEqual(client, undefined); const js = await fixture.readFile(client); - expect(js).not.to.match(/\w+\.component\(\"Bar\"/gm); + assert.doesNotMatch(js, /\w+\.component\(\"Bar\"/gm); }); }); @@ -202,9 +202,9 @@ describe('App Entrypoint async', () => { const $ = cheerioLoad(html); // test 1: component before await renders - expect($('#foo > #bar').text()).to.eq('works'); + assert.equal($('#foo > #bar').text(), 'works'); // test 2: component after await renders - expect($('#foo > #baz').text()).to.eq('works'); + assert.equal($('#foo > #baz').text(), 'works'); }); }); diff --git a/packages/integrations/vue/test/basics.test.js b/packages/integrations/vue/test/basics.test.js index 92b25032e8..1f83e490f0 100644 --- a/packages/integrations/vue/test/basics.test.js +++ b/packages/integrations/vue/test/basics.test.js @@ -1,5 +1,6 @@ import { loadFixture } from './test-utils.js'; -import { expect } from 'chai'; +import * as assert from 'node:assert/strict'; +import { describe, it, before } from 'node:test'; import { parseHTML } from 'linkedom'; describe('Basics', () => { /** @type {import('./test-utils').Fixture} */ @@ -17,7 +18,7 @@ describe('Basics', () => { const { document } = parseHTML(data); const bar = document.querySelector('#foo'); - expect(bar).not.to.be.undefined; - expect(bar.getAttribute('slot')).to.be.null; + assert.notEqual(bar, undefined); + assert.equal(bar.getAttribute('slot'), null); }); }); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 307fc01b65..57c3533e7b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -4941,18 +4941,12 @@ importers: astro-scripts: specifier: workspace:* version: link:../../../scripts - chai: - specifier: ^4.3.7 - version: 4.3.10 cheerio: specifier: 1.0.0-rc.12 version: 1.0.0-rc.12 linkedom: specifier: ^0.16.4 version: 0.16.6 - mocha: - specifier: ^10.2.0 - version: 10.2.0 vite: specifier: ^5.0.12 version: 5.0.12(@types/node@18.19.4)(sass@1.69.6)