Skip to content

Commit 838dd4f

Browse files
ZachJW34ZachJW34
authored
fix: make component derived info not throw (#24571)
1 parent 3cdbeca commit 838dd4f

File tree

9 files changed

+100
-79
lines changed

9 files changed

+100
-79
lines changed

‎npm/angular/src/mount.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,7 @@ function bootstrapModule<T> (
156156
})
157157

158158
// check if the component is a standalone component
159-
if ((component as any).ɵcmp.standalone) {
159+
if ((component as any).ɵcmp?.standalone) {
160160
testModuleMetaData.imports.push(component)
161161
} else {
162162
testModuleMetaData.declarations.push(component)

‎npm/react/src/createMount.ts

+7-7
Original file line numberDiff line numberDiff line change
@@ -40,12 +40,6 @@ export const makeMountFn = (
4040

4141
mountCleanup = internalMountOptions.cleanup
4242

43-
// Get the display name property via the component constructor
44-
// @ts-ignore FIXME
45-
const componentName = getDisplayName(jsx.type)
46-
47-
const jsxComponentName = `<${componentName} ... />`
48-
4943
return cy
5044
.then(() => {
5145
const reactDomToUse = internalMountOptions.reactDom
@@ -99,6 +93,12 @@ export const makeMountFn = (
9993
.wait(0, { log: false })
10094
.then(() => {
10195
if (options.log !== false) {
96+
// Get the display name property via the component constructor
97+
// @ts-ignore FIXME
98+
const componentName = getDisplayName(jsx)
99+
100+
const jsxComponentName = `<${componentName} ... />`
101+
102102
Cypress.log({
103103
name: type,
104104
type: 'parent',
@@ -108,7 +108,7 @@ export const makeMountFn = (
108108
consoleProps: () => {
109109
return {
110110
// @ts-ignore protect the use of jsx functional components use ReactNode
111-
props: jsx.props,
111+
props: jsx?.props,
112112
description: type === 'mount' ? 'Mounts React component' : 'Rerenders mounted React component',
113113
home: 'https://github.com/cypress-io/cypress',
114114
}

‎npm/react/src/getDisplayName.ts

+6-12
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
type JSX = Function & { displayName: string }
1+
import type { ReactNode } from 'react'
22

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

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

17-
if (nameFromCache != null) {
18-
return nameFromCache
17+
if (!type) {
18+
return fallbackName
1919
}
2020

2121
let displayName: string | null = null
@@ -49,11 +49,5 @@ export default function getDisplayName (
4949
}
5050
}
5151

52-
try {
53-
cachedDisplayNames.set(type, displayName)
54-
} catch (e) {
55-
// do nothing
56-
}
57-
5852
return displayName
5953
}

‎npm/vue/src/index.ts

+1-4
Original file line numberDiff line numberDiff line change
@@ -370,7 +370,7 @@ export function mount<
370370
* Mounts a component and returns an object containing the component and VueWrapper
371371
* @param componentOptions
372372
* @param options
373-
* @returns {Cypress.Chainable<{wrapper: VueWrapper<T>, component: T}
373+
* @returns {Cypress.Chainable<{wrapper: VueWrapper<T>, component: T}>}
374374
* @see {@link https://on.cypress.io/mounting-vue} for more details.
375375
* @example
376376
* import { mount } from '@cypress/vue'
@@ -387,9 +387,6 @@ export function mount (componentOptions: any, options: any = {}) {
387387
// Remove last mounted component if cy.mount is called more than once in a test
388388
cleanup()
389389

390-
// TODO: get the real displayName and props from VTU shallowMount
391-
const componentName = getComponentDisplayName(componentOptions)
392-
393390
// then wait for cypress to load
394391
return cy.then(() => {
395392
// @ts-ignore

‎system-tests/__snapshots__/component_testing_spec.ts.js

+24-20
Original file line numberDiff line numberDiff line change
@@ -156,19 +156,20 @@ exports['React major versions with Webpack executes all of the tests for React v
156156
157157
158158
mount
159+
✓ does not error when rendering primitives
159160
teardown
160161
✓ should mount
161162
✓ should remove previous mounted component
162163
163164
164-
2 passing
165+
3 passing
165166
166167
167168
(Results)
168169
169170
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
170-
│ Tests: 2 │
171-
│ Passing: 2 │
171+
│ Tests: 3 │
172+
│ Passing: 3 │
172173
│ Failing: 0 │
173174
│ Pending: 0 │
174175
│ Skipped: 0 │
@@ -200,9 +201,9 @@ exports['React major versions with Webpack executes all of the tests for React v
200201
├────────────────────────────────────────────────────────────────────────────────────────────────┤
201202
│ ✔ Rerendering.cy.jsx XX:XX 1 1 - - - │
202203
├────────────────────────────────────────────────────────────────────────────────────────────────┤
203-
│ ✔ mount.cy.jsx XX:XX 2 2 - - - │
204+
│ ✔ mount.cy.jsx XX:XX 3 3 - - - │
204205
└────────────────────────────────────────────────────────────────────────────────────────────────┘
205-
✔ All specs passed! XX:XX 9 9 - - -
206+
✔ All specs passed! XX:XX 10 10 - - -
206207
207208
208209
`
@@ -365,19 +366,20 @@ exports['React major versions with Webpack executes all of the tests for React v
365366
366367
367368
mount
369+
✓ does not error when rendering primitives
368370
teardown
369371
✓ should mount
370372
✓ should remove previous mounted component
371373
372374
373-
2 passing
375+
3 passing
374376
375377
376378
(Results)
377379
378380
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
379-
│ Tests: 2 │
380-
│ Passing: 2 │
381+
│ Tests: 3 │
382+
│ Passing: 3 │
381383
│ Failing: 0 │
382384
│ Pending: 0 │
383385
│ Skipped: 0 │
@@ -409,9 +411,9 @@ exports['React major versions with Webpack executes all of the tests for React v
409411
├────────────────────────────────────────────────────────────────────────────────────────────────┤
410412
│ ✔ Rerendering.cy.jsx XX:XX 1 1 - - - │
411413
├────────────────────────────────────────────────────────────────────────────────────────────────┤
412-
│ ✔ mount.cy.jsx XX:XX 2 2 - - - │
414+
│ ✔ mount.cy.jsx XX:XX 3 3 - - - │
413415
└────────────────────────────────────────────────────────────────────────────────────────────────┘
414-
✔ All specs passed! XX:XX 9 9 - - -
416+
✔ All specs passed! XX:XX 10 10 - - -
415417
416418
417419
`
@@ -573,19 +575,20 @@ exports['React major versions with Vite executes all of the tests for React v17
573575
574576
575577
mount
578+
✓ does not error when rendering primitives
576579
teardown
577580
✓ should mount
578581
✓ should remove previous mounted component
579582
580583
581-
2 passing
584+
3 passing
582585
583586
584587
(Results)
585588
586589
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
587-
│ Tests: 2 │
588-
│ Passing: 2 │
590+
│ Tests: 3 │
591+
│ Passing: 3 │
589592
│ Failing: 0 │
590593
│ Pending: 0 │
591594
│ Skipped: 0 │
@@ -617,9 +620,9 @@ exports['React major versions with Vite executes all of the tests for React v17
617620
├────────────────────────────────────────────────────────────────────────────────────────────────┤
618621
│ ✔ Rerendering.cy.jsx XX:XX 1 1 - - - │
619622
├────────────────────────────────────────────────────────────────────────────────────────────────┤
620-
│ ✔ mount.cy.jsx XX:XX 2 2 - - - │
623+
│ ✔ mount.cy.jsx XX:XX 3 3 - - - │
621624
└────────────────────────────────────────────────────────────────────────────────────────────────┘
622-
✔ All specs passed! XX:XX 9 9 - - -
625+
✔ All specs passed! XX:XX 10 10 - - -
623626
624627
625628
`
@@ -781,19 +784,20 @@ exports['React major versions with Vite executes all of the tests for React v18
781784
782785
783786
mount
787+
✓ does not error when rendering primitives
784788
teardown
785789
✓ should mount
786790
✓ should remove previous mounted component
787791
788792
789-
2 passing
793+
3 passing
790794
791795
792796
(Results)
793797
794798
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
795-
│ Tests: 2 │
796-
│ Passing: 2 │
799+
│ Tests: 3 │
800+
│ Passing: 3 │
797801
│ Failing: 0 │
798802
│ Pending: 0 │
799803
│ Skipped: 0 │
@@ -825,9 +829,9 @@ exports['React major versions with Vite executes all of the tests for React v18
825829
├────────────────────────────────────────────────────────────────────────────────────────────────┤
826830
│ ✔ Rerendering.cy.jsx XX:XX 1 1 - - - │
827831
├────────────────────────────────────────────────────────────────────────────────────────────────┤
828-
│ ✔ mount.cy.jsx XX:XX 2 2 - - - │
832+
│ ✔ mount.cy.jsx XX:XX 3 3 - - - │
829833
└────────────────────────────────────────────────────────────────────────────────────────────────┘
830-
✔ All specs passed! XX:XX 9 9 - - -
834+
✔ All specs passed! XX:XX 10 10 - - -
831835
832836
833837
`

0 commit comments

Comments
 (0)