chore: merge develop (#27468)

* fix(cypress/webpack-dev-server): correct path for `indexHtmlFile` (#27320)

* fix: correct path for indexHtmlt

* changelog

* chore: release @cypress/webpack-dev-server-v3.5.2

[skip ci]

* chore: update external dependency paths in binary cleanup (#27460)

---------

Co-authored-by: Lachlan Miller <lachlan.miller.1990@outlook.com>
Co-authored-by: semantic-release-bot <semantic-release-bot@martynus.net>
Co-authored-by: Adam Stone-Lord <adams@cypress.io>

cli/CHANGELOG.md

@@ -20,6 +20,7 @@ _Released 07/20/2023_
 - Fixed an issue where commands would fail with the error `must only be invoked from the spec file or support file` if their arguments were mutated. Fixes [#27200](https://github.com/cypress-io/cypress/issues/27200).
 - Fixed an issue where `cy.writeFile()` would erroneously fail with the error `cy.writeFile() must only be invoked from the spec file or support file`. Fixes [#27097](https://github.com/cypress-io/cypress/issues/27097).
 - Fixed an issue where web workers could not be created within a spec. Fixes [#27298](https://github.com/cypress-io/cypress/issues/27298).
+- Fixed an issue where having `cypress.config` in a nested directory would cause problems with locating the `component-index.html` file when using component testing. Fixes [#26400](https://github.com/cypress-io/cypress/issues/26400).
 
 ## 12.17.1
 

npm/webpack-dev-server/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [@cypress/webpack-dev-server-v3.5.2](https://github.com/cypress-io/cypress/compare/@cypress/webpack-dev-server-v3.5.1...@cypress/webpack-dev-server-v3.5.2) (2023-08-04)
+
+
+### Bug Fixes
+
+* **cypress/webpack-dev-server:** correct path for `indexHtmlFile` ([#27320](https://github.com/cypress-io/cypress/issues/27320)) ([53fd537](https://github.com/cypress-io/cypress/commit/53fd537a0486caedc7faccacff7c6433ebc2601f))
+
 # [@cypress/webpack-dev-server-v3.5.1](https://github.com/cypress-io/cypress/compare/@cypress/webpack-dev-server-v3.5.0...@cypress/webpack-dev-server-v3.5.1) (2023-07-18)
 
 

npm/webpack-dev-server/cypress/e2e/webpack-dev-server.cy.ts

@@ -12,6 +12,17 @@ describe('Config options', () => {
     cy.get('.passed > .num').should('contain', 1)
   })
 
+  it('supports nested config', () => {
+    cy.scaffoldProject('webpack-react-nested-config')
+    cy.openProject('webpack-react-nested-config', ['--config-file', 'cypress/cypress.config.js'])
+    cy.startAppServer('component')
+
+    cy.visitApp()
+    cy.contains('foo.cy.js').click()
+    cy.waitForSpecToFinish()
+    cy.get('.passed > .num').should('contain', 1)
+  })
+
   it('supports @cypress/webpack-dev-server', () => {
     cy.scaffoldProject('webpack5_wds4-react')
     cy.openProject('webpack5_wds4-react', ['--config-file', 'cypress-webpack-dev-server-function.config.ts'])

npm/webpack-dev-server/src/makeDefaultWebpackConfig.ts

@@ -78,7 +78,7 @@ export function makeCypressWebpackConfig (
     },
     plugins: [
       new (HtmlWebpackPlugin as typeof import('html-webpack-plugin-5'))({
-        template: indexHtmlFile,
+        template: indexHtmlFile ? path.join(projectRoot, indexHtmlFile) : undefined,
         // Angular generates all of it's scripts with <script type="module">. Live-reloading breaks without this option.
         // We need to manually set the base here to `/__cypress/src/` so that static assets load with our proxy
         ...(framework === 'angular' ? { scriptLoading: 'module', base: '/__cypress/src/' } : {}),

packages/server/lib/modes/run.ts

@@ -1145,6 +1145,7 @@ async function ready (options: { projectRoot: string, record: boolean, key: stri
 }
 
 export async function run (options, loading: Promise<void>) {
+  // Check if running as electron process
   if (require('../util/electron-app').isRunningAsElectronProcess({ debug })) {
     const app = require('electron').app
 

scripts/binary/binary-cleanup.js

@@ -88,6 +88,7 @@ const getDependencyPathsToKeep = async (buildAppDir) => {
         'emitter',
         'ts-loader',
         '@babel/preset-typescript/package.json',
+        './addon/addon-native',
       ],
     })
 

system-tests/projects/webpack-react-nested-config/cypress/cypress.config.js

@@ -0,0 +1,10 @@
+const { devServer } = require('@cypress/webpack-dev-server')
+
+module.exports = {
+  component: {
+    supportFile: false,
+    devServer: (args) => {
+      return devServer({ ...args, webpackConfig: {} })
+    },
+  },
+}

system-tests/projects/webpack-react-nested-config/cypress/support/component-index.html

@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+<body>
+  <div data-cy-root></div> 
+</body>
+</html>

system-tests/projects/webpack-react-nested-config/package.json

@@ -0,0 +1,7 @@
+{
+  "devDependencies": {
+    "@cypress/webpack-dev-server": "file:../../../npm/webpack-dev-server",
+    "webpack": "^5",
+    "webpack-dev-server": "^4"
+  }
+}

system-tests/projects/webpack-react-nested-config/src/foo.cy.js

@@ -0,0 +1,3 @@
+it('renders hello world', () => {
+  expect(1).to.eq(1)
+})