Skip to content

Commit

Permalink
fix: make component derived info not throw (#24571)
Browse files Browse the repository at this point in the history
  • Loading branch information
ZachJW34 committed Nov 7, 2022
1 parent 3cdbeca commit 838dd4f
Show file tree
Hide file tree
Showing 9 changed files with 100 additions and 79 deletions.
2 changes: 1 addition & 1 deletion npm/angular/src/mount.ts
Expand Up @@ -156,7 +156,7 @@ function bootstrapModule<T> (
})

// check if the component is a standalone component
if ((component as any).ɵcmp.standalone) {
if ((component as any).ɵcmp?.standalone) {
testModuleMetaData.imports.push(component)
} else {
testModuleMetaData.declarations.push(component)
Expand Down
14 changes: 7 additions & 7 deletions npm/react/src/createMount.ts
Expand Up @@ -40,12 +40,6 @@ export const makeMountFn = (

mountCleanup = internalMountOptions.cleanup

// Get the display name property via the component constructor
// @ts-ignore FIXME
const componentName = getDisplayName(jsx.type)

const jsxComponentName = `<${componentName} ... />`

return cy
.then(() => {
const reactDomToUse = internalMountOptions.reactDom
Expand Down Expand Up @@ -99,6 +93,12 @@ export const makeMountFn = (
.wait(0, { log: false })
.then(() => {
if (options.log !== false) {
// Get the display name property via the component constructor
// @ts-ignore FIXME
const componentName = getDisplayName(jsx)

const jsxComponentName = `<${componentName} ... />`

Cypress.log({
name: type,
type: 'parent',
Expand All @@ -108,7 +108,7 @@ export const makeMountFn = (
consoleProps: () => {
return {
// @ts-ignore protect the use of jsx functional components use ReactNode
props: jsx.props,
props: jsx?.props,
description: type === 'mount' ? 'Mounts React component' : 'Rerenders mounted React component',
home: 'https://github.com/cypress-io/cypress',
}
Expand Down
18 changes: 6 additions & 12 deletions npm/react/src/getDisplayName.ts
@@ -1,6 +1,6 @@
type JSX = Function & { displayName: string }
import type { ReactNode } from 'react'

const cachedDisplayNames: WeakMap<JSX, string> = new WeakMap()
type JSX = Function & { displayName: string }

/**
* Gets the display name of the component when possible.
Expand All @@ -9,13 +9,13 @@ const cachedDisplayNames: WeakMap<JSX, string> = new WeakMap()
* @link https://github.com/facebook/react-devtools/blob/master/backend/getDisplayName.js
*/
export default function getDisplayName (
type: JSX,
node: ReactNode,
fallbackName: string = 'Unknown',
): string {
const nameFromCache = cachedDisplayNames.get(type)
const type: JSX | undefined = (node as any)?.type

if (nameFromCache != null) {
return nameFromCache
if (!type) {
return fallbackName
}

let displayName: string | null = null
Expand Down Expand Up @@ -49,11 +49,5 @@ export default function getDisplayName (
}
}

try {
cachedDisplayNames.set(type, displayName)
} catch (e) {
// do nothing
}

return displayName
}
5 changes: 1 addition & 4 deletions npm/vue/src/index.ts
Expand Up @@ -370,7 +370,7 @@ export function mount<
* Mounts a component and returns an object containing the component and VueWrapper
* @param componentOptions
* @param options
* @returns {Cypress.Chainable<{wrapper: VueWrapper<T>, component: T}
* @returns {Cypress.Chainable<{wrapper: VueWrapper<T>, component: T}>}
* @see {@link https://on.cypress.io/mounting-vue} for more details.
* @example
* import { mount } from '@cypress/vue'
Expand All @@ -387,9 +387,6 @@ export function mount (componentOptions: any, options: any = {}) {
// Remove last mounted component if cy.mount is called more than once in a test
cleanup()

// TODO: get the real displayName and props from VTU shallowMount
const componentName = getComponentDisplayName(componentOptions)

// then wait for cypress to load
return cy.then(() => {
// @ts-ignore
Expand Down
44 changes: 24 additions & 20 deletions system-tests/__snapshots__/component_testing_spec.ts.js
Expand Up @@ -156,19 +156,20 @@ exports['React major versions with Webpack executes all of the tests for React v
mount
✓ does not error when rendering primitives
teardown
✓ should mount
✓ should remove previous mounted component
2 passing
3 passing
(Results)
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
│ Tests: 2
│ Passing: 2
│ Tests: 3
│ Passing: 3
│ Failing: 0 │
│ Pending: 0 │
│ Skipped: 0 │
Expand Down Expand Up @@ -200,9 +201,9 @@ exports['React major versions with Webpack executes all of the tests for React v
├────────────────────────────────────────────────────────────────────────────────────────────────┤
│ ✔ Rerendering.cy.jsx XX:XX 1 1 - - - │
├────────────────────────────────────────────────────────────────────────────────────────────────┤
│ ✔ mount.cy.jsx XX:XX 2 2 - - - │
│ ✔ mount.cy.jsx XX:XX 3 3 - - - │
└────────────────────────────────────────────────────────────────────────────────────────────────┘
✔ All specs passed! XX:XX 9 9 - - -
✔ All specs passed! XX:XX 10 10 - - -
`
Expand Down Expand Up @@ -365,19 +366,20 @@ exports['React major versions with Webpack executes all of the tests for React v
mount
✓ does not error when rendering primitives
teardown
✓ should mount
✓ should remove previous mounted component
2 passing
3 passing
(Results)
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
│ Tests: 2
│ Passing: 2
│ Tests: 3
│ Passing: 3
│ Failing: 0 │
│ Pending: 0 │
│ Skipped: 0 │
Expand Down Expand Up @@ -409,9 +411,9 @@ exports['React major versions with Webpack executes all of the tests for React v
├────────────────────────────────────────────────────────────────────────────────────────────────┤
│ ✔ Rerendering.cy.jsx XX:XX 1 1 - - - │
├────────────────────────────────────────────────────────────────────────────────────────────────┤
│ ✔ mount.cy.jsx XX:XX 2 2 - - - │
│ ✔ mount.cy.jsx XX:XX 3 3 - - - │
└────────────────────────────────────────────────────────────────────────────────────────────────┘
✔ All specs passed! XX:XX 9 9 - - -
✔ All specs passed! XX:XX 10 10 - - -
`
Expand Down Expand Up @@ -573,19 +575,20 @@ exports['React major versions with Vite executes all of the tests for React v17
mount
✓ does not error when rendering primitives
teardown
✓ should mount
✓ should remove previous mounted component
2 passing
3 passing
(Results)
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
│ Tests: 2
│ Passing: 2
│ Tests: 3
│ Passing: 3
│ Failing: 0 │
│ Pending: 0 │
│ Skipped: 0 │
Expand Down Expand Up @@ -617,9 +620,9 @@ exports['React major versions with Vite executes all of the tests for React v17
├────────────────────────────────────────────────────────────────────────────────────────────────┤
│ ✔ Rerendering.cy.jsx XX:XX 1 1 - - - │
├────────────────────────────────────────────────────────────────────────────────────────────────┤
│ ✔ mount.cy.jsx XX:XX 2 2 - - - │
│ ✔ mount.cy.jsx XX:XX 3 3 - - - │
└────────────────────────────────────────────────────────────────────────────────────────────────┘
✔ All specs passed! XX:XX 9 9 - - -
✔ All specs passed! XX:XX 10 10 - - -
`
Expand Down Expand Up @@ -781,19 +784,20 @@ exports['React major versions with Vite executes all of the tests for React v18
mount
✓ does not error when rendering primitives
teardown
✓ should mount
✓ should remove previous mounted component
2 passing
3 passing
(Results)
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
│ Tests: 2
│ Passing: 2
│ Tests: 3
│ Passing: 3
│ Failing: 0 │
│ Pending: 0 │
│ Skipped: 0 │
Expand Down Expand Up @@ -825,9 +829,9 @@ exports['React major versions with Vite executes all of the tests for React v18
├────────────────────────────────────────────────────────────────────────────────────────────────┤
│ ✔ Rerendering.cy.jsx XX:XX 1 1 - - - │
├────────────────────────────────────────────────────────────────────────────────────────────────┤
│ ✔ mount.cy.jsx XX:XX 2 2 - - - │
│ ✔ mount.cy.jsx XX:XX 3 3 - - - │
└────────────────────────────────────────────────────────────────────────────────────────────────┘
✔ All specs passed! XX:XX 9 9 - - -
✔ All specs passed! XX:XX 10 10 - - -
`
Expand Down

5 comments on commit 838dd4f

@cypress-bot
Copy link
Contributor

@cypress-bot cypress-bot bot commented on 838dd4f Nov 7, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Circle has built the linux arm64 version of the Test Runner.

Learn more about this pre-release platform-specific build at https://on.cypress.io/installing-cypress#Install-pre-release-version.

Run this command to install the pre-release locally:

npm install https://cdn.cypress.io/beta/npm/11.0.0/linux-arm64/develop-838dd4fa2e0ec56633d0af2faf10a47d190b5594/cypress.tgz

@cypress-bot
Copy link
Contributor

@cypress-bot cypress-bot bot commented on 838dd4f Nov 7, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Circle has built the linux x64 version of the Test Runner.

Learn more about this pre-release platform-specific build at https://on.cypress.io/installing-cypress#Install-pre-release-version.

Run this command to install the pre-release locally:

npm install https://cdn.cypress.io/beta/npm/11.0.0/linux-x64/develop-838dd4fa2e0ec56633d0af2faf10a47d190b5594/cypress.tgz

@cypress-bot
Copy link
Contributor

@cypress-bot cypress-bot bot commented on 838dd4f Nov 7, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Circle has built the darwin x64 version of the Test Runner.

Learn more about this pre-release platform-specific build at https://on.cypress.io/installing-cypress#Install-pre-release-version.

Run this command to install the pre-release locally:

npm install https://cdn.cypress.io/beta/npm/11.0.0/darwin-x64/develop-838dd4fa2e0ec56633d0af2faf10a47d190b5594/cypress.tgz

@cypress-bot
Copy link
Contributor

@cypress-bot cypress-bot bot commented on 838dd4f Nov 7, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Circle has built the win32 x64 version of the Test Runner.

Learn more about this pre-release platform-specific build at https://on.cypress.io/installing-cypress#Install-pre-release-version.

Run this command to install the pre-release locally:

npm install https://cdn.cypress.io/beta/npm/11.0.0/win32-x64/develop-838dd4fa2e0ec56633d0af2faf10a47d190b5594/cypress.tgz

@cypress-bot
Copy link
Contributor

@cypress-bot cypress-bot bot commented on 838dd4f Nov 8, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Circle has built the darwin arm64 version of the Test Runner.

Learn more about this pre-release platform-specific build at https://on.cypress.io/installing-cypress#Install-pre-release-version.

Run this command to install the pre-release locally:

npm install https://cdn.cypress.io/beta/npm/11.0.0/darwin-arm64/develop-838dd4fa2e0ec56633d0af2faf10a47d190b5594/cypress.tgz

Please sign in to comment.