Skip to content

Commit 2588a44

Browse files
committed
Replace spawnd with execa in wait-for-data-match utility and update related tests
1 parent 0668a0e commit 2588a44

File tree

7 files changed

+38
-49
lines changed

7 files changed

+38
-49
lines changed

package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -34,14 +34,14 @@
3434
"cross-env": "^7.0.3",
3535
"eslint": "^9.18.0",
3636
"eslint-plugin-playwright": "^2.1.0",
37+
"execa": "^9.5.2",
3738
"fast-glob": "^3.3.3",
3839
"get-tsconfig": "^4.8.1",
3940
"jest-extended": "^4.0.2",
4041
"jest-text-transformer": "^1.0.4",
4142
"js-beautify": "^1.15.1",
4243
"nanoid": "^4.0.2",
4344
"shuffle-array": "^1.0.1",
44-
"spawnd": "^9.0.2",
4545
"strip-ansi": "^7.1.0",
4646
"techor": "^3.1.7",
4747
"tinybench": "^3.1.0",

packages/cli/tests/extract/watch/test.ts

+14-14
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import cssEscape from 'shared/utils/css-escape'
66
import waitForDataMatch from 'shared/utils/wait-for-data-match'
77
import dedent from 'ts-dedent'
88
import { it, beforeAll, afterAll, expect } from 'vitest'
9-
import { spawnd, SpawndChildProcess } from 'spawnd'
9+
import { execa, ExecaChildProcess } from 'execa'
1010

1111
const HTMLFilepath = path.join(__dirname, 'test.html')
1212
const originHTMLText = dedent`
@@ -51,19 +51,19 @@ export default config
5151

5252
const virtualCSSFilepath = path.join(__dirname, '.virtual/master.css')
5353

54-
let child: SpawndChildProcess
54+
let subprocess: ExecaChildProcess
5555

5656
beforeAll(() => {
5757
fs.writeFileSync(HTMLFilepath, originHTMLText, { flag: 'w+' })
5858
fs.writeFileSync(optionsFilepath, originOptionsText, { flag: 'w+' })
5959
fs.writeFileSync(configFilepath, originConfigText, { flag: 'w+' })
60-
child = spawnd('tsx ../../../src/bin extract -w', { shell: true, cwd: __dirname })
60+
subprocess = execa('tsx ../../../src/bin extract -w', { shell: true, cwd: __dirname })
6161
}, 120000)
6262

6363
it('start watch process', async () => {
6464
await Promise.all([
65-
waitForDataMatch(child, (data) => data.includes('Start watching source changes')),
66-
waitForDataMatch(child, (data) => data.includes('exported'))
65+
waitForDataMatch(subprocess, (data) => data.includes('Start watching source changes')),
66+
waitForDataMatch(subprocess, (data) => data.includes('exported'))
6767
])
6868
const fileCSSText = fs.readFileSync(virtualCSSFilepath, { encoding: 'utf8' })
6969
expect(fileCSSText).toContain(cssEscape('font:heavy'))
@@ -74,39 +74,39 @@ it('start watch process', async () => {
7474

7575
it('change options file `fixed` and reset process', async () => {
7676
await Promise.all([
77-
waitForDataMatch(child, (data) => data.includes('watching source changes'), async () => {
77+
waitForDataMatch(subprocess, (data) => data.includes('watching source changes'), async () => {
7878
fs.writeFileSync(optionsFilepath, originOptionsText.replace('fixed: []', 'fixed: [\'fg:red\']'))
7979
}),
80-
waitForDataMatch(child, (data) => data.includes(`inserted 'fg:red'`)),
81-
waitForDataMatch(child, (data) => data.includes('exported')),
80+
waitForDataMatch(subprocess, (data) => data.includes(`inserted 'fg:red'`)),
81+
waitForDataMatch(subprocess, (data) => data.includes('exported')),
8282
])
8383
const fileCSSText = fs.readFileSync(virtualCSSFilepath, { encoding: 'utf8' })
8484
expect(fileCSSText).toContain(cssEscape('fg:red'))
8585
}, 120000)
8686

8787
it('change config file `styles` and reset process', async () => {
8888
await Promise.all([
89-
waitForDataMatch(child, (data) => data.includes('watching source changes'), async () => {
89+
waitForDataMatch(subprocess, (data) => data.includes('watching source changes'), async () => {
9090
fs.writeFileSync(configFilepath, originConfigText.replace('bg:red', 'bg:blue'))
9191
}),
92-
waitForDataMatch(child, (data) => data.includes('exported'))
92+
waitForDataMatch(subprocess, (data) => data.includes('exported'))
9393
])
9494
const fileCSSText = fs.readFileSync(virtualCSSFilepath, { encoding: 'utf8' })
9595
expect(fileCSSText).toContain('.btn{background-color:rgb(var(--blue))')
9696
}, 120000)
9797

9898
it('change html file class attr and update', async () => {
9999
await Promise.all([
100-
waitForDataMatch(child, (data) => data.includes('watching source changes'), () => {
100+
waitForDataMatch(subprocess, (data) => data.includes('watching source changes'), () => {
101101
fs.writeFileSync(HTMLFilepath, originHTMLText.replace('hmr-test', 'text:underline'))
102102
}),
103-
waitForDataMatch(child, (data) => data.includes(`classes inserted`)),
104-
waitForDataMatch(child, (data) => data.includes('exported'))
103+
waitForDataMatch(subprocess, (data) => data.includes(`classes inserted`)),
104+
waitForDataMatch(subprocess, (data) => data.includes('exported'))
105105
])
106106
const fileCSSText = fs.readFileSync(virtualCSSFilepath, { encoding: 'utf8' })
107107
expect(fileCSSText).toContain(cssEscape('text:underline'))
108108
}, 120000)
109109

110110
afterAll(async () => {
111-
await child.destroy()
111+
subprocess.kill()
112112
}, 120000)

packages/extractor.vite/tests/nuxt.js/dev.test.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,13 @@ import path from 'path'
44
import cssEscape from 'shared/utils/css-escape'
55
import puppeteer, { type Browser, type Page } from 'puppeteer-core'
66
import { copy } from 'shared/utils/fs'
7-
import { SpawndChildProcess, spawnd } from 'spawnd'
87
import waitForDataMatch from 'shared/utils/wait-for-data-match'
8+
import { execa, ExecaChildProcess } from 'execa'
99

1010
const examplePath = path.join(__dirname, '../../../../examples/nuxt.js-with-static-extraction')
1111
const tmpDir = path.join(__dirname, 'tmp/dev')
1212

13-
let devProcess: SpawndChildProcess
13+
let devProcess: ExecaChildProcess
1414
let browser: Browser
1515
let page: Page
1616
let error: Error
@@ -24,7 +24,7 @@ test.todo('nuxt.js dev tests timeout in CI', () => {
2424
templatePath = path.join(tmpDir, 'app.vue')
2525
templateContent = fs.readFileSync(templatePath).toString()
2626
masterCSSConfigPath = path.join(tmpDir, 'master.css.ts')
27-
devProcess = spawnd('pnpm dev', { shell: true, cwd: tmpDir, env: { ...process.env, NODE_ENV: 'development' } })
27+
devProcess = execa('pnpm dev', { shell: true, cwd: tmpDir, env: { ...process.env, NODE_ENV: 'development' } })
2828
const urlPattern = /(http:\/\/localhost:).*?([0-9]+)/
2929
const data = await waitForDataMatch(devProcess, (data) => urlPattern.exec(data)?.length)
3030
const result = urlPattern.exec(data)
@@ -76,6 +76,6 @@ test.todo('nuxt.js dev tests timeout in CI', () => {
7676
afterAll(async () => {
7777
await page.close()
7878
await browser.close()
79-
await devProcess.destroy()
79+
devProcess.kill()
8080
}, 60000)
8181
})

packages/extractor.vite/tests/react/dev.test.ts

+4-5
Original file line numberDiff line numberDiff line change
@@ -4,16 +4,15 @@ import path from 'path'
44
import cssEscape from 'shared/utils/css-escape'
55
import puppeteer, { type Browser, type Page } from 'puppeteer-core'
66
import { copy, rm } from 'shared/utils/fs'
7-
import { SpawndChildProcess, spawnd } from 'spawnd'
7+
import { execa, ExecaChildProcess } from 'execa'
88
import waitForDataMatch from 'shared/utils/wait-for-data-match'
9-
import delay from 'shared/utils/delay'
109

1110
test.todo('react dev tests timeout in CI')
1211
if (!process.env.GITHUB_ACTIONS) {
1312
const examplePath = path.join(__dirname, '../../../../examples/react-with-static-extraction')
1413
const tmpDir = path.join(__dirname, 'tmp/dev')
1514

16-
let devProcess: SpawndChildProcess
15+
let devProcess: ExecaChildProcess
1716
let browser: Browser
1817
let page: Page
1918
let error: Error
@@ -26,7 +25,7 @@ if (!process.env.GITHUB_ACTIONS) {
2625
templatePath = path.join(tmpDir, 'src/App.tsx')
2726
templateContent = fs.readFileSync(templatePath).toString()
2827
masterCSSConfigPath = path.join(tmpDir, 'master.css.ts')
29-
devProcess = spawnd('pnpm dev --port 4003', { shell: true, cwd: tmpDir })
28+
devProcess = execa('pnpm dev --port 4003', { shell: true, cwd: tmpDir })
3029
const urlPattern = /(http:\/\/localhost:).*?([0-9]+)/
3130
const data = await waitForDataMatch(devProcess, (data) => urlPattern.exec(data)?.length)
3231
const result = urlPattern.exec(data)
@@ -77,6 +76,6 @@ if (!process.env.GITHUB_ACTIONS) {
7776
afterAll(async () => {
7877
await page.close()
7978
await browser.close()
80-
await devProcess.destroy()
79+
devProcess.kill()
8180
}, 60000)
8281
}

packages/extractor.vite/tests/vite/dev.test.ts

+4-5
Original file line numberDiff line numberDiff line change
@@ -4,16 +4,15 @@ import path from 'path'
44
import cssEscape from 'shared/utils/css-escape'
55
import puppeteer, { type Browser, type Page } from 'puppeteer-core'
66
import { copy, rm } from 'shared/utils/fs'
7-
import { SpawndChildProcess, spawnd } from 'spawnd'
87
import waitForDataMatch from 'shared/utils/wait-for-data-match'
9-
import delay from 'shared/utils/delay'
8+
import { execa, ExecaChildProcess } from 'execa'
109

1110
test.todo('vite dev tests timeout in CI')
1211
if (!process.env.GITHUB_ACTIONS) {
1312
const examplePath = path.join(__dirname, '../../../../examples/vite-with-static-extraction')
1413
const tmpDir = path.join(__dirname, 'tmp/dev')
1514

16-
let devProcess: SpawndChildProcess
15+
let devProcess: ExecaChildProcess
1716
let browser: Browser
1817
let page: Page
1918
let error: Error
@@ -26,7 +25,7 @@ if (!process.env.GITHUB_ACTIONS) {
2625
templatePath = path.join(tmpDir, 'index.html')
2726
templateContent = fs.readFileSync(templatePath).toString()
2827
masterCSSConfigPath = path.join(tmpDir, 'master.css.ts')
29-
devProcess = spawnd('pnpm dev --port 4005', { shell: true, cwd: tmpDir })
28+
devProcess = execa('pnpm dev --port 4005', { shell: true, cwd: tmpDir })
3029
const urlPattern = /(http:\/\/localhost:).*?([0-9]+)/
3130
const data = await waitForDataMatch(devProcess, (data) => urlPattern.exec(data)?.length)
3231
const result = urlPattern.exec(data)
@@ -76,6 +75,6 @@ if (!process.env.GITHUB_ACTIONS) {
7675
afterAll(async () => {
7776
await page.close()
7877
await browser.close()
79-
await devProcess.destroy()
78+
devProcess.kill()
8079
}, 60000)
8180
}

pnpm-lock.yaml

+3-12
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

shared/utils/wait-for-data-match.ts

+8-8
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,26 @@
1-
import { SpawndChildProcess } from 'spawnd'
21
import stripAnsi from 'strip-ansi'
2+
import { ExecaChildProcess } from 'execa'
33

4-
export default function (child: SpawndChildProcess, doesDataMatch: (data: string) => any, onReady?: () => void): Promise<string> {
4+
export default function (child: ExecaChildProcess, doesDataMatch: (data: string) => any, onReady?: () => void): Promise<string> {
55
return new Promise<string>((resolve, reject) => {
66
const handler = (data: any) => {
77
const strippedData = stripAnsi(data.toString())
88
if (doesDataMatch(strippedData)) {
9-
child.stdout.off('data', handler)
10-
child.stderr.off('data', errorHandler)
9+
child?.stdout?.off('data', handler)
10+
child?.stderr?.off('data', errorHandler)
1111
resolve(strippedData)
1212
}
1313
}
1414
const errorHandler = (data: any) => {
1515
const strippedData = stripAnsi(data.toString().replace(/(?:\r\n|\n|\r)/g, ''))
1616
if (strippedData) {
17-
child.stdout.off('data', handler)
18-
child.stderr.off('data', errorHandler)
17+
child?.stdout?.off('data', handler)
18+
child?.stderr?.off('data', errorHandler)
1919
reject(strippedData)
2020
}
2121
}
22-
child.stdout.on('data', handler)
23-
child.stderr.on('data', errorHandler)
22+
child?.stdout?.on('data', handler)
23+
child?.stderr?.on('data', errorHandler)
2424
onReady?.()
2525
})
2626
}

0 commit comments

Comments
 (0)