mirror/cypress
1
0
Fork 0
mirror of https://github.com/cypress-io/cypress.git synced 2026-02-11 01:29:59 -06:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' into develop

Browse Source
This commit is contained in:
Lachlan Miller
2021-04-28 15:05:09 +00:00
parent f251e28fd5 042fb6a0c0
commit e5ab805beb
10 changed files with 69 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
npm/react/examples/nextjs/next.config.js
View File

@@ -1,4 +1,3 @@
const withMDX = require('@next/mdx')()
const withSass = require('@zeit/next-sass')
module.exports = withSass(withMDX())
module.exports = withMDX()

3
npm/react/examples/nextjs/pages/index.js
View File

@@ -1,11 +1,12 @@
import * as React from 'react'
import { Search } from '../components/Search'
import HelloWorld from '../components/HelloWorld.mdx'
import styles from '../styles/Home.module.css'
function IndexPage ({ asyncProp }) {
return (
<main>
<h1>Welcome to Next.js</h1>
<h1 className={styles.welcome}>Welcome to Next.js</h1>
{asyncProp && (
<p data-testid="server-result">

3
npm/react/examples/nextjs/styles/Home.module.css Normal file
View File

@@ -0,0 +1,3 @@
.welcome {
color: blue;
}

13
npm/react/plugins/next/index-template.html Normal file
View File

@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Components App</title>
<div id="__next_css__DO_NOT_USE__"></div>
</head>
<body>
<div id="__cy_root"></div>
</body>
</html>

7
npm/react/plugins/next/index.js
View File

@@ -1,4 +1,5 @@
const findNextWebpackConfig = require('./findNextWebpackConfig')
const path = require('path')
module.exports = (on, config) => {
on('dev-server:start', async (options) => {
@@ -7,7 +8,11 @@ module.exports = (on, config) => {
// require('webpack') now points to nextjs bundled version
const { startDevServer } = require('@cypress/webpack-dev-server')
return startDevServer({ options, webpackConfig })
return startDevServer({
options,
webpackConfig,
template: path.resolve(__dirname, 'index-template.html'),
})
})
config.env.reactDevtools = true

7
npm/vite-dev-server/CHANGELOG.md
View File

@@ -1,3 +1,10 @@
# [@cypress/vite-dev-server-v1.2.5](https://github.com/cypress-io/cypress/compare/@cypress/vite-dev-server-v1.2.4...@cypress/vite-dev-server-v1.2.5) (2021-04-27)
### Bug Fixes
* **vite-dev-server:** fix url to the client on win ([#16220](https://github.com/cypress-io/cypress/issues/16220)) ([c809d19](https://github.com/cypress-io/cypress/commit/c809d19cc139200232a4292529b3bac60d68e995))
# [@cypress/vite-dev-server-v1.2.4](https://github.com/cypress-io/cypress/compare/@cypress/vite-dev-server-v1.2.3...@cypress/vite-dev-server-v1.2.4) (2021-04-26)

10
npm/webpack-dev-server/README.md
View File

@@ -58,6 +58,16 @@ Webpack-dev-server fulfills his reponsibilities by
- picks the spec that should be run
- runs the `AUT-Runner.ts` to load and launch the support file and the current spec
## API
`startDevServer` takes an object of options.
- `options` (required): this contains various internal configuration. It's provided as the first argument to the `dev-server:start` event. Just make sure you pass it.
- `webpackConfig` (optional): the webpack config used by your application. We provide some [presets](https://github.com/cypress-io/cypress/tree/develop/npm/react/plugins), but you can pass the `webpackConfig` manually, too.
- `template` (optional): by default [this index.html](https://github.com/cypress-io/cypress/blob/develop/npm/webpack-dev-server/index-template.html) is used. You can provide your own using this option. This is useful if you'd like to include some CDN links, or in some way customize the default html. If you are passing this option, ensure your `index.html` contains the same content as [the default template](https://github.com/cypress-io/cypress/blob/develop/npm/webpack-dev-server/index-template.html). Some of our presets include a custom `index.html`, such as [Next](https://github.com/cypress-io/cypress/tree/develop/npm/react/plugins/next).
See [npm/react/plugins/next](https://github.com/cypress-io/cypress/blob/develop/npm/react/plugins/next/index.js) for a full example using all the options.
## Performance tests
In order to get webpack performance statistics run `yarn cypress open-ct` or `yarn cypress run-ct` with `WEBPACK_PERF_MEASURE` env variable:

7
npm/webpack-dev-server/src/makeWebpackConfig.ts
View File

@@ -2,7 +2,7 @@ import { debug as debugFn } from 'debug'
import * as path from 'path'
import * as webpack from 'webpack'
import { merge } from 'webpack-merge'
import defaultWebpackConfig from './webpack.config'
import makeDefaultWebpackConfig from './webpack.config'
import CypressCTOptionsPlugin, { CypressCTOptionsPluginOptions } from './plugin'
const debug = debugFn('cypress:webpack-dev-server:makeWebpackConfig')
@@ -20,13 +20,14 @@ export interface UserWebpackDevServerOptions {
interface MakeWebpackConfigOptions extends CypressCTOptionsPluginOptions, UserWebpackDevServerOptions {
devServerPublicPathRoute: string
isOpenMode: boolean
template?: string
}
const OsSeparatorRE = RegExp(`\\${path.sep}`, 'g')
const posixSeparator = '/'
export async function makeWebpackConfig (userWebpackConfig: webpack.Configuration, options: MakeWebpackConfigOptions): Promise<webpack.Configuration> {
const { projectRoot, devServerPublicPathRoute, files, supportFile, devServerEvents } = options
const { projectRoot, devServerPublicPathRoute, files, supportFile, devServerEvents, template } = options
debug(`User passed in webpack config with values %o`, userWebpackConfig)
@@ -79,7 +80,7 @@ export async function makeWebpackConfig (userWebpackConfig: webpack.Configuratio
const mergedConfig = merge<webpack.Configuration>(
userWebpackConfig,
defaultWebpackConfig,
makeDefaultWebpackConfig(template),
dynamicWebpackConfig,
)

5
npm/webpack-dev-server/src/startServer.ts
View File

@@ -8,11 +8,13 @@ export interface StartDevServer extends UserWebpackDevServerOptions {
options: Cypress.DevServerOptions
/* support passing a path to the user's webpack config */
webpackConfig?: Record<string, any>
/* base html template to render in AUT */
template?: string
}
const debug = Debug('cypress:webpack-dev-server:start')
export async function start ({ webpackConfig: userWebpackConfig, options, ...userOptions }: StartDevServer, exitProcess = process.exit): Promise<WebpackDevServer> {
export async function start ({ webpackConfig: userWebpackConfig, template, options, ...userOptions }: StartDevServer, exitProcess = process.exit): Promise<WebpackDevServer> {
if (!userWebpackConfig) {
debug('User did not pass in any webpack configuration')
}
@@ -22,6 +24,7 @@ export async function start ({ webpackConfig: userWebpackConfig, options, ...use
const webpackConfig = await makeWebpackConfig(userWebpackConfig || {}, {
files: options.specs,
template,
projectRoot,
devServerPublicPathRoute,
devServerEvents: options.devServerEvents,

33
npm/webpack-dev-server/src/webpack.config.js
View File

@@ -1,19 +1,24 @@
const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
/** @type {import('webpack').Configuration} */
module.exports = {
mode: 'development',
optimization: {
splitChunks: {
chunks: 'all',
/**
* @param {string} [template] - base template to use
* @returns {import('webpack').Configuration}
*/
module.exports = function makeDefaultConfig (template) {
return {
mode: 'development',
optimization: {
splitChunks: {
chunks: 'all',
},
},
},
output: {
filename: '[name].js',
path: path.resolve(__dirname, 'dist'),
},
plugins: [new HtmlWebpackPlugin({
template: path.resolve(__dirname, '..', 'index-template.html'),
})],
output: {
filename: '[name].js',
path: path.resolve(__dirname, 'dist'),
},
plugins: [new HtmlWebpackPlugin({
template: template || path.resolve(__dirname, '..', 'index-template.html'),
})],
}
}