Skip to content

Commit 2573375

Browse files
estrada9166estrada9166
authored
feat: add devServer to config file (#18962)
1 parent d8309ea commit 2573375

File tree

26 files changed

+344
-337
lines changed

26 files changed

+344
-337
lines changed

‎npm/angular/cypress.config.ts

+9
Original file line numberDiff line numberDiff line change
@@ -10,5 +10,14 @@ export default defineConfig({
1010
'componentFolder': 'src/app',
1111
'testFiles': '**/*cy-spec.ts',
1212
'setupNodeEvents': require('./cypress/plugins'),
13+
devServer (cypressConfig) {
14+
const { startDevServer } = require('@cypress/webpack-dev-server')
15+
const webpackConfig = require('./cypress/plugins/webpack.config')
16+
17+
return startDevServer({
18+
options: cypressConfig,
19+
webpackConfig,
20+
})
21+
},
1322
},
1423
})

‎npm/angular/cypress/plugins/index.ts

-9
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,7 @@
11
import { addMatchImageSnapshotPlugin } from 'cypress-image-snapshot/plugin'
2-
import * as webpackConfig from './webpack.config'
32

43
module.exports = (on, config) => {
54
addMatchImageSnapshotPlugin(on, config)
6-
const { startDevServer } = require('@cypress/webpack-dev-server')
7-
8-
on('dev-server:start', (options) => {
9-
return startDevServer({
10-
options,
11-
webpackConfig,
12-
})
13-
})
145

156
require('@cypress/code-coverage/task')(on, config)
167

‎npm/design-system/cypress.config.js

+2-4
Original file line numberDiff line numberDiff line change
@@ -14,12 +14,10 @@ module.exports = {
1414
componentFolder: 'src',
1515
fixturesFolder: false,
1616
component: {
17-
setupNodeEvents (on, config) {
17+
devServer (cypressConfig) {
1818
const { startDevServer } = require('@cypress/vite-dev-server')
1919

20-
on('dev-server:start', (options) => startDevServer({ options }))
21-
22-
return config
20+
return startDevServer({ options: cypressConfig })
2321
},
2422
},
2523
}

‎npm/react/cypress.config.js

+2-6
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ module.exports = {
1515
],
1616
'experimentalFetchPolyfill': true,
1717
'component': {
18-
setupNodeEvents (on, config) {
18+
devServer (cypressConfig, devServerConfig) {
1919
const { startDevServer } = require('@cypress/webpack-dev-server')
2020
const path = require('path')
2121
const babelConfig = require('./babel.config.js')
@@ -73,11 +73,7 @@ module.exports = {
7373
},
7474
}
7575

76-
on('dev-server:start', (options) => {
77-
return startDevServer({ options, webpackConfig, disableLazyCompilation: false })
78-
})
79-
80-
return config
76+
return startDevServer({ options: cypressConfig, disableLazyCompilation: false, webpackConfig })
8177
},
8278
},
8379
}

‎npm/react/examples/find-webpack/cypress.config.ts

+6-6
Original file line numberDiff line numberDiff line change
@@ -6,25 +6,25 @@ export default defineConfig({
66
'component': {
77
'testFiles': '**/*.spec.{js,ts,jsx,tsx}',
88
'componentFolder': 'src',
9-
setupNodeEvents (on, config) {
9+
devServer (cypressConfig) {
1010
const findReactScriptsWebpackConfig = require('@cypress/react/plugins/react-scripts/findReactScriptsWebpackConfig')
1111
const { startDevServer } = require('@cypress/webpack-dev-server')
1212
const _ = require('lodash')
1313

1414
const map = _.map([4, 8], (n) => n * 2)
1515

1616
console.log(map)
17-
require('@cypress/code-coverage/task')(on, config)
18-
const webpackConfig = findReactScriptsWebpackConfig(config)
17+
const webpackConfig = findReactScriptsWebpackConfig(cypressConfig.config)
1918

2019
const rules = webpackConfig.module.rules.find((rule) => !!rule.oneOf).oneOf
2120
const babelRule = rules.find((rule) => typeof rule.loader === 'string' && /babel-loader/.test(rule.loader))
2221

2322
typeof babelRule.options !== 'string' && babelRule.options.plugins.push(require.resolve('babel-plugin-istanbul'))
2423

25-
on('dev-server:start', (options) => {
26-
return startDevServer({ options, webpackConfig })
27-
})
24+
return startDevServer({ options: cypressConfig, webpackConfig })
25+
},
26+
setupNodeEvents (on, config) {
27+
require('@cypress/code-coverage/task')(on, config)
2828

2929
// IMPORTANT to return the config object
3030
// with the any changed environment variables

‎npm/react/examples/webpack-options/cypress.config.js

+2-4
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ module.exports = {
55
'viewportWidth': 500,
66
'viewportHeight': 500,
77
'component': {
8-
setupNodeEvents (on, config) {
8+
devServer (cypressConfig) {
99
const path = require('path')
1010
const { startDevServer } = require('@cypress/webpack-dev-server')
1111
const babelConfig = require('./babel.config')
@@ -34,10 +34,8 @@ module.exports = {
3434
}
3535

3636
process.env.BABEL_ENV = 'test' // this is required to load commonjs babel plugin
37-
on('dev-server:start', (options) => startDevServer({ options, webpackConfig }))
3837

39-
// if adding code coverage, important to return updated config
40-
return config
38+
return startDevServer({ options: cypressConfig, webpackConfig })
4139
},
4240
},
4341
}

‎npm/vite-dev-server/cypress.config.ts

+6-10
Original file line numberDiff line numberDiff line change
@@ -7,20 +7,16 @@ export default defineConfig({
77
'testFiles': '**/*.spec.*',
88
'componentFolder': 'cypress/components',
99
'component': {
10-
setupNodeEvents (on, config) {
10+
devServer (cypressConfig) {
1111
const path = require('path')
1212
const { startDevServer } = require('./dist')
1313

14-
on('dev-server:start', async (options) => {
15-
return startDevServer({
16-
options,
17-
viteConfig: {
18-
configFile: path.resolve(__dirname, 'vite.config.ts'),
19-
},
20-
})
14+
return startDevServer({
15+
options: cypressConfig,
16+
viteConfig: {
17+
configFile: path.resolve(__dirname, 'vite.config.ts'),
18+
},
2119
})
22-
23-
return config
2420
},
2521
},
2622
})

‎npm/vue/cypress.config.ts

+4-2
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ export default defineConfig({
99
'testFiles': '**/*spec.{js,ts,tsx}',
1010
'experimentalFetchPolyfill': true,
1111
'component': {
12-
setupNodeEvents (on, config) {
12+
devServer (cypressConfig) {
1313
const { startDevServer } = require('@cypress/webpack-dev-server')
1414
const webpackConfig = require('./webpack.config')
1515

@@ -22,8 +22,10 @@ export default defineConfig({
2222
'@vue/compiler-core$': '@vue/compiler-core/dist/compiler-core.cjs.js',
2323
}
2424

25+
return startDevServer({ options: cypressConfig, webpackConfig })
26+
},
27+
setupNodeEvents (on, config) {
2528
require('@cypress/code-coverage/task')(on, config)
26-
on('dev-server:start', (options) => startDevServer({ options, webpackConfig }))
2729

2830
return config
2931
},

‎npm/vue/examples/code-coverage/cypress.config.js

+6-7
Original file line numberDiff line numberDiff line change
@@ -4,17 +4,16 @@ module.exports = {
44
'testFiles': '**/*.spec.js',
55
'video': false,
66
'component': {
7-
setupNodeEvents (on, config) {
7+
devServer (cypressConfig) {
88
const { startDevServer } = require('@cypress/webpack-dev-server')
99
const webpackConfig = require('./webpack.config')
1010

11-
on('dev-server:start', (options) => {
12-
return startDevServer({
13-
options,
14-
webpackConfig,
15-
})
11+
return startDevServer({
12+
options: cypressConfig,
13+
webpackConfig,
1614
})
17-
15+
},
16+
setupNodeEvents (on, config) {
1817
require('@cypress/code-coverage/task')(on, config)
1918

2019
return config

‎npm/vue/examples/vue-cli/cypress.config.js

+17-18
Original file line numberDiff line numberDiff line change
@@ -4,29 +4,28 @@ module.exports = {
44
'testFiles': '**/*spec.js',
55
'componentFolder': 'src',
66
'component': {
7-
setupNodeEvents (on, config) {
7+
devServer (cypressConfig) {
88
const { startDevServer } = require('@cypress/webpack-dev-server')
99
const webpackConfig = require('@vue/cli-service/webpack.config')
1010

11-
on('dev-server:start', (options) => {
12-
// HtmlPwaPlugin is coupled to a hook in HtmlWebpackPlugin
13-
// that was deprecated after 3.x. We currently only support
14-
// HtmlWebpackPlugin 4.x and 5.x.
15-
// TODO: Figure out how to deal with 2 major versions old HtmlWebpackPlugin
16-
// which is still in widespread usage.
17-
const modifiedWebpackConfig = {
18-
...webpackConfig,
19-
plugins: (webpackConfig.plugins || []).filter((x) => {
20-
return x.constructor.name !== 'HtmlPwaPlugin'
21-
}),
22-
}
11+
// HtmlPwaPlugin is coupled to a hook in HtmlWebpackPlugin
12+
// that was deprecated after 3.x. We currently only support
13+
// HtmlWebpackPlugin 4.x and 5.x.
14+
// TODO: Figure out how to deal with 2 major versions old HtmlWebpackPlugin
15+
// which is still in widespread usage.
16+
const modifiedWebpackConfig = {
17+
...webpackConfig,
18+
plugins: (webpackConfig.plugins || []).filter((x) => {
19+
return x.constructor.name !== 'HtmlPwaPlugin'
20+
}),
21+
}
2322

24-
return startDevServer({
25-
options,
26-
webpackConfig: modifiedWebpackConfig,
27-
})
23+
return startDevServer({
24+
options: cypressConfig,
25+
webpackConfig: modifiedWebpackConfig,
2826
})
29-
27+
},
28+
setupNodeEvents (on, config) {
3029
require('@cypress/code-coverage/task')(on, config)
3130

3231
return config

‎packages/app/cypress.config.ts

+16-20
Original file line numberDiff line numberDiff line change
@@ -20,28 +20,24 @@ export default defineConfig({
2020
'component': {
2121
'testFiles': '**/*.{spec,cy}.{js,ts,tsx,jsx}',
2222
'supportFile': 'cypress/component/support/index.ts',
23-
setupNodeEvents (on, config) {
23+
devServer (cypressConfig, devServerConfig) {
2424
const { startDevServer } = require('@cypress/vite-dev-server')
2525

26-
on('dev-server:start', async (options) => {
27-
return startDevServer({
28-
options,
29-
viteConfig: {
30-
// TODO(tim): Figure out why this isn't being picked up
31-
optimizeDeps: {
32-
include: [
33-
'@headlessui/vue',
34-
'vue3-file-selector',
35-
'just-my-luck',
36-
'combine-properties',
37-
'faker',
38-
],
39-
},
40-
},
41-
})
42-
})
43-
44-
return config
26+
return startDevServer({ options: cypressConfig, ...devServerConfig })
27+
},
28+
devServerConfig: {
29+
viteConfig: {
30+
// TODO(tim): Figure out why this isn't being picked up
31+
optimizeDeps: {
32+
include: [
33+
'@headlessui/vue',
34+
'vue3-file-selector',
35+
'just-my-luck',
36+
'combine-properties',
37+
'faker',
38+
],
39+
},
40+
},
4541
},
4642
},
4743
'e2e': {

‎packages/data-context/src/sources/WizardDataSource.ts

+5-7
Original file line numberDiff line numberDiff line change
@@ -267,14 +267,12 @@ const getFrameworkConfigFile = (opts: GetCodeOptsCt) => {
267267
const { getWebpackConfig } = require('nuxt')
268268
269269
module.exports = {
270-
component (on, config) {
271-
on('dev-server:start', async (options) => {
272-
let webpackConfig = await getWebpackConfig('modern', 'dev')
270+
async devServer (cypressConfig, devServerConfig) {
271+
let webpackConfig = await getWebpackConfig('modern', 'dev')
273272
274-
return startDevServer({
275-
options,
276-
webpackConfig,
277-
})
273+
return startDevServer({
274+
options,
275+
webpackConfig,
278276
})
279277
},
280278
}

‎packages/desktop-gui/cypress.config.js

+2-7
Original file line numberDiff line numberDiff line change
@@ -32,16 +32,11 @@ module.exports = {
3232
},
3333
},
3434
'component': {
35-
setupNodeEvents (on, config) {
35+
devServer (cypressConfig) {
3636
const { startDevServer } = require('@cypress/webpack-dev-server')
37-
3837
const webpackConfig = require('./webpack.config').default
3938

40-
on('dev-server:start', (options) => {
41-
return startDevServer({ options, webpackConfig })
42-
})
43-
44-
return config
39+
return startDevServer({ options: cypressConfig, webpackConfig })
4540
},
4641
},
4742
}

‎packages/frontend-shared/cypress.config.ts

+5-25
Original file line numberDiff line numberDiff line change
@@ -18,33 +18,13 @@ export default defineConfig({
1818
'componentFolder': 'src',
1919
'component': {
2020
'testFiles': '**/*.spec.{js,ts,tsx,jsx}',
21-
setupNodeEvents (on, config) {
21+
devServer (cypressConfig) {
2222
const { startDevServer } = require('@cypress/vite-dev-server')
2323

24-
// `on` is used to hook into various events Cypress emits
25-
// `config` is the resolved Cypress config
26-
27-
if (config.testingType === 'component') {
28-
on('dev-server:start', async (options) => {
29-
return startDevServer({
30-
options,
31-
viteConfig: {
32-
// TODO(tim): Figure out why this isn't being picked up
33-
optimizeDeps: {
34-
include: [
35-
'@headlessui/vue',
36-
'vue3-file-selector',
37-
'just-my-luck',
38-
'combine-properties',
39-
'faker',
40-
],
41-
},
42-
},
43-
})
44-
})
45-
}
46-
47-
return config // IMPORTANT to return a config
24+
return startDevServer({
25+
options: cypressConfig,
26+
viteConfig: require('./vite.config'),
27+
})
4828
},
4929
},
5030
'e2e': {

0 commit comments

Comments
 (0)