#8579 & #8614: Migrate mod component form state #20905
Annotations
10 errors
src/pageEditor/panes/EditorPane.test.tsx#L233
expect(received).toMatchSnapshot()
Snapshot name: `renders a mod component with sub pipeline 1`
- Snapshot - 3
+ Received + 59
@@ -602,21 +602,21 @@
class="annotationPlaceholder"
/>
</div>
<label
class="label form-label"
- for="extension.heading"
+ for="modComponent.heading"
>
Tab Title
</label>
<div
class="formField"
>
<input
class="form-control"
- id="extension.heading"
- name="extension.heading"
+ id="modComponent.heading"
+ name="modComponent.heading"
value=""
/>
<small
class="text-muted form-text"
>
@@ -662,11 +662,67 @@
<div
class="formField"
>
<ul
class="list-group mb-2"
+ >
+ <li
+ class="list-group-item py-1"
+ >
+ <div
+ class="formGroup mb-0 form-group"
+ >
+ <div
+ class="mb-2 w-100 collapse"
+ >
+ <div
+ class="annotationPlaceholder"
+ />
+ </div>
+ <div
+ class="formField"
+ >
+ <div
+ class="root"
+ >
+ <div
+ class="field"
+ >
+ <textarea
+ class="form-control"
+ id="starterBrick.definition.isAvailable.matchPatterns.0"
+ name="starterBrick.definition.isAvailable.matchPatterns.0"
+ rows="1"
+ >
+ https://www.mySite1.com/*
+ </textarea>
+ </div>
+ <div
+ class="dropdown dropdown"
+ data-test-selected="Text"
+ data-testid="toggle-starterBrick.definition.isAvailable.matchPatterns.0"
+ >
+ <button
+ aria-expanded="false"
+ aria-haspopup="true"
+ class="dropdown-toggle btn btn-link"
+ type="button"
+ >
+ <span
+ class="symbol"
+ >
+ <test-file-stub
+ classname="root"
/>
+ </span>
+ </button>
+ </div>
+ </div>
+ </div>
+ </div>
+ </li>
+ </ul>
<button
class="addButton btn btn-link"
type="button"
>
Add Site
at Object.toMatchSnapshot (src/pageEditor/panes/EditorPane.test.tsx:233:26)
|
src/components/form/ConnectedFieldTemplate.test.tsx#L134
TestingLibraryElementError: Unable to find an element with the text: test analysis error annotation. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, <script />, <style />
<body>
<div>
<form
action="#"
>
<div
class="formGroup form-group"
>
<div
class="mb-2 w-100 collapse"
>
<div
class="annotationPlaceholder"
/>
</div>
<label
class="label form-label"
for="extension.blockPipeline[0].config.testField"
>
Test Field
</label>
<div
class="formField"
>
<input
class="form-control"
id="extension.blockPipeline[0].config.testField"
name="extension.blockPipeline[0].config.testField"
value=""
/>
</div>
</div>
<button
type="submit"
>
Submit
</button>
</form>
</div>
</body>
at Object.getElementError (node_modules/@testing-library/dom/dist/config.js:38:19)
at node_modules/@testing-library/dom/dist/query-helpers.js:90:38
at node_modules/@testing-library/dom/dist/query-helpers.js:62:17
at node_modules/@testing-library/dom/dist/query-helpers.js:111:19
at Object.getByText (src/components/form/ConnectedFieldTemplate.test.tsx:134:16)
|
src/components/form/ConnectedFieldTemplate.test.tsx#L199
TestingLibraryElementError: Unable to find an element with the text: test analysis error annotation. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, <script />, <style />
<body>
<div>
<form
action="#"
>
<div
class="formGroup form-group"
>
<div
class="mb-2 w-100 collapse show"
>
<div
class="root error"
>
<div
class="alert"
>
<test-file-stub
classname="icon"
/>
<div
class="message"
>
<span>
test formik error
</span>
</div>
</div>
</div>
</div>
<label
class="label form-label"
for="extension.blockPipeline[0].config.testField"
>
Test Field
</label>
<div
class="formField"
>
<input
class="form-control is-invalid"
id="extension.blockPipeline[0].config.testField"
name="extension.blockPipeline[0].config.testField"
value=""
/>
</div>
</div>
<button
type="submit"
>
Submit
</button>
</form>
</div>
</body>
at Object.getElementError (node_modules/@testing-library/dom/dist/config.js:38:19)
at node_modules/@testing-library/dom/dist/query-helpers.js:90:38
at node_modules/@testing-library/dom/dist/query-helpers.js:62:17
at node_modules/@testing-library/dom/dist/query-helpers.js:111:19
at Object.getByText (src/components/form/ConnectedFieldTemplate.test.tsx:199:16)
|
src/components/form/ConnectedFieldTemplate.test.tsx#L265
TestingLibraryElementError: Unable to find an element with the text: test analysis error annotation 1. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, <script />, <style />
<body>
<div>
<form
action="#"
>
<div
class="formGroup form-group"
>
<div
class="mb-2 w-100 collapse"
>
<div
class="annotationPlaceholder"
/>
</div>
<label
class="label form-label"
for="extension.blockPipeline[0].config.testField"
>
Test Field
</label>
<div
class="formField"
>
<input
class="form-control"
id="extension.blockPipeline[0].config.testField"
name="extension.blockPipeline[0].config.testField"
value=""
/>
</div>
</div>
<button
type="submit"
>
Submit
</button>
</form>
</div>
</body>
at Object.getElementError (node_modules/@testing-library/dom/dist/config.js:38:19)
at node_modules/@testing-library/dom/dist/query-helpers.js:90:38
at node_modules/@testing-library/dom/dist/query-helpers.js:62:17
at node_modules/@testing-library/dom/dist/query-helpers.js:111:19
at Object.getByText (src/components/form/ConnectedFieldTemplate.test.tsx:265:16)
|
src/components/form/ConnectedFieldTemplate.test.tsx#L357
TestingLibraryElementError: Unable to find an element with the text: Matching detail value. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, <script />, <style />
<body>
<div>
<form
action="#"
>
<div
class="formGroup form-group"
>
<div
class="mb-2 w-100 collapse show"
>
<div
class="root error"
>
<div
class="alert"
>
<test-file-stub
classname="icon"
/>
<div
class="message"
>
<span>
No detail value
</span>
</div>
</div>
</div>
</div>
<label
class="label form-label"
for="extension.blockPipeline[0].config.testField"
>
Test Field
</label>
<div
class="formField"
>
<input
class="form-control is-invalid"
id="extension.blockPipeline[0].config.testField"
name="extension.blockPipeline[0].config.testField"
value=""
/>
</div>
</div>
<button
type="submit"
>
Submit
</button>
</form>
</div>
</body>
at Object.getElementError (node_modules/@testing-library/dom/dist/config.js:38:19)
at node_modules/@testing-library/dom/dist/query-helpers.js:90:38
at node_modules/@testing-library/dom/dist/query-helpers.js:62:17
at node_modules/@testing-library/dom/dist/query-helpers.js:111:19
at Object.getByText (src/components/form/ConnectedFieldTemplate.test.tsx:357:21)
|
src/integrations/components/RequireIntegrationConfig.test.tsx#L149
expect(received).resolves.toBeInTheDocument()
Received promise rejected instead of resolved
Rejected to value: [TestingLibraryElementError: Unable to find an element with the text: Child Component using config Test Config 1. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.·
Ignored nodes: comments, <script />, <style />
<body>
<div>
<form
action="#"
>
<div
class="formGroup form-group"
>
<div
class="mb-2 w-100 collapse"
>
<div
class="annotationPlaceholder"
/>
</div>
<label
class="label form-label"
for="extension.blockPipeline[0].config.integration"
>
Integration
</label>
<div
class="formField"
>
<div
class="d-flex"
>
<div
class="flex-grow-1"
>
<div
class=" css-b62m3t-container"
>
<span
class="css-1f43avz-a11yText-A11yText"
id="react-select-2-live-region"
/>
<span
aria-atomic="false"
aria-live="polite"
aria-relevant="additions text"
class="css-1f43avz-a11yText-A11yText"
role="log"
/>
<div
class=" css-13cymwt-control"
>
<div
class=" css-1fdsijx-ValueContainer"
>
<div
class=" css-1jqq78o-placeholder"
id="react-select-2-placeholder"
>
Select...
</div>
<div
class=" css-qbdosj-Input"
data-value=""
>
<input
aria-activedescendant=""
aria-autocomplete="list"
aria-describedby="react-select-2-placeholder"
aria-expanded="false"
aria-haspopup="true"
autocapitalize="none"
autocomplete="off"
autocorrect="off"
class=""
id="extension.blockPipeline[0].config.integration"
role="combobox"
spellcheck="false"
style="opacity: 0; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
tabindex="0"
type="text"
value=""
/>
</div>
</div>
<div
class=" css-1hb7zxy-IndicatorsContainer"
>
<span
class=" css-1u9des2-indicatorSeparator"
/>
<div
aria-hidden="true"
class=" css-1xc3v61-indicatorContainer"
>
<svg
aria-hidden="true"
class="css-tj5bde-Svg"
focusable="false"
height="20"
viewBox="0 0 20 20"
width="20"
>
<path
d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
/>
</svg>
</div>
</div>
</div>
|
src/integrations/components/RequireIntegrationConfig.test.tsx#L208
TestingLibraryElementError: Unable to find an element with the text: The configuration for this integration is invalid. Check your credentials and try again.. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, <script />, <style />
<body>
<div>
<form
action="#"
>
<div
class="formGroup form-group"
>
<div
class="mb-2 w-100 collapse"
>
<div
class="annotationPlaceholder"
/>
</div>
<label
class="label form-label"
for="extension.blockPipeline[0].config.integration"
>
Integration
</label>
<div
class="formField"
>
<div
class="d-flex"
>
<div
class="flex-grow-1"
>
<div
class=" css-b62m3t-container"
>
<span
class="css-1f43avz-a11yText-A11yText"
id="react-select-3-live-region"
/>
<span
aria-atomic="false"
aria-live="polite"
aria-relevant="additions text"
class="css-1f43avz-a11yText-A11yText"
role="log"
/>
<div
class=" css-13cymwt-control"
>
<div
class=" css-1fdsijx-ValueContainer"
>
<div
class=" css-1jqq78o-placeholder"
id="react-select-3-placeholder"
>
Select...
</div>
<div
class=" css-qbdosj-Input"
data-value=""
>
<input
aria-activedescendant=""
aria-autocomplete="list"
aria-describedby="react-select-3-placeholder"
aria-expanded="false"
aria-haspopup="true"
autocapitalize="none"
autocomplete="off"
autocorrect="off"
class=""
id="extension.blockPipeline[0].config.integration"
role="combobox"
spellcheck="false"
style="opacity: 0; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
tabindex="0"
type="text"
value=""
/>
</div>
</div>
<div
class=" css-1hb7zxy-IndicatorsContainer"
>
<span
class=" css-1u9des2-indicatorSeparator"
/>
<div
aria-hidden="true"
class=" css-1xc3v61-indicatorContainer"
>
<svg
aria-hidden="true"
class="css-tj5bde-Svg"
focusable="false"
height="20"
viewBox="0 0 20 20"
width="20"
>
<path
d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
/>
</svg>
</div>
</div>
</div>
<input
name="extension.blockPipe
|
src/components/fields/schemaFields/integrations/integrationDependencyFieldUtils.ts#L79
TypeError: Cannot read properties of undefined (reading 'blockPipeline')
at blockPipeline (src/components/fields/schemaFields/integrations/integrationDependencyFieldUtils.ts:79:24)
at selectIntegrationDependencyVariables (src/components/fields/schemaFields/integrations/integrationDependencyFieldUtils.ts:93:16)
at recipe (node_modules/immer/src/core/immerClass.ts:94:14)
at produceExcludeUnusedDependencies (src/components/fields/schemaFields/integrations/integrationDependencyFieldUtils.ts:106:17)
at setIntegrationAuthSelectionForField (src/components/fields/schemaFields/integrations/IntegrationDependencyWidget.tsx:158:47)
at setIntegrationAuthSelectionForField (src/components/fields/schemaFields/integrations/IntegrationDependencyWidget.tsx:302:28)
at node_modules/use-async-effect/index.js:11:24
at invokePassiveEffectCreate (node_modules/react-dom/cjs/react-dom.development.js:23487:20)
at HTMLUnknownElement.callCallback (node_modules/react-dom/cjs/react-dom.development.js:3945:14)
at Object.invokeGuardedCallbackDev (node_modules/react-dom/cjs/react-dom.development.js:3994:16)
at invokeGuardedCallback (node_modules/react-dom/cjs/react-dom.development.js:4056:31)
at flushPassiveEffectsImpl (node_modules/react-dom/cjs/react-dom.development.js:23574:9)
at unstable_runWithPriority (node_modules/scheduler/cjs/scheduler.development.js:468:12)
at runWithPriority$1 (node_modules/react-dom/cjs/react-dom.development.js:11276:10)
at flushPassiveEffects (node_modules/react-dom/cjs/react-dom.development.js:23447:14)
at Object.<anonymous>.flushWork (node_modules/react-dom/cjs/react-dom-test-utils.development.js:992:10)
at act (node_modules/react-dom/cjs/react-dom-test-utils.development.js:1107:9)
at render (node_modules/@testing-library/react/dist/pure.js:97:26)
at src/testUtils/testHelpers.tsx:167:25
at renderWidget (src/components/fields/schemaFields/integrations/IntegrationDependencyWidget.test.tsx:74:9)
at Object.renderWidget (src/components/fields/schemaFields/integrations/IntegrationDependencyWidget.test.tsx:169:5)
|
src/components/fields/schemaFields/integrations/IntegrationDependencyWidget.test.tsx#L173
TestingLibraryElementError: Unable to find an element with the text: Test 1. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, <script />, <style />
<body>
<div>
<div
class="d-flex"
>
<div
class="flex-grow-1"
>
<div
class=" css-b62m3t-container"
>
<span
class="css-1f43avz-a11yText-A11yText"
id="react-select-4-live-region"
/>
<span
aria-atomic="false"
aria-live="polite"
aria-relevant="additions text"
class="css-1f43avz-a11yText-A11yText"
role="log"
/>
<div
class=" css-13cymwt-control"
>
<div
class=" css-1fdsijx-ValueContainer"
>
<div
class=" css-1jqq78o-placeholder"
id="react-select-4-placeholder"
>
Select...
</div>
<div
class=" css-qbdosj-Input"
data-value=""
>
<input
aria-activedescendant=""
aria-autocomplete="list"
aria-describedby="react-select-4-placeholder"
aria-expanded="false"
aria-haspopup="true"
autocapitalize="none"
autocomplete="off"
autocorrect="off"
class=""
id="extension.blockPipeline.0.config.service"
role="combobox"
spellcheck="false"
style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
tabindex="0"
type="text"
value=""
/>
</div>
</div>
<div
class=" css-1hb7zxy-IndicatorsContainer"
>
<span
class=" css-1u9des2-indicatorSeparator"
/>
<div
aria-hidden="true"
class=" css-1xc3v61-indicatorContainer"
>
<svg
aria-hidden="true"
class="css-tj5bde-Svg"
focusable="false"
height="20"
viewBox="0 0 20 20"
width="20"
>
<path
d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
/>
</svg>
</div>
</div>
</div>
<input
name="extension.blockPipeline.0.config.service"
type="hidden"
value=""
/>
</div>
</div>
<div>
<button
class="btn btn-info"
title="Refresh configured integrations"
type="button"
>
<svg
aria-hidden="true"
class="svg-inline--fa fa-sync fa-w-16 "
data-icon="sync"
data-prefix="fas"
focusable="false"
role="img"
viewBox="0 0 512 512"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M440.65 12.57l4 82.77A247.16 247.16 0 0 0 255.83 8C134.73 8 33.91 94.92 12.29 209.82A12 12 0 0 0 24.09 224h49.05a12 12 0 0 0 11.67-9.26 175.91 175.91 0 0 1 317-56.94l-101.46-4.86a12 12 0 0 0-12.57 12v47.41a12 12 0 0 0 12 12H500a12 12 0 0 0 12-12V12a12 12 0 0 0-12-12h-47.37a12 12 0 0 0-11.98 12.57zM255.83 432a175.61 175.61 0 0 1-146-77.8l101.8 4.87a12 12 0 0 0 12.57-12v-47.4a12 12 0 0 0-12-12H12a12 12 0 0 0-12 12V500a12 12 0 0 0 12 12h47
|
src/components/fields/schemaFields/integrations/integrationDependencyFieldUtils.ts#L79
TypeError: Cannot read properties of undefined (reading 'blockPipeline')
at blockPipeline (src/components/fields/schemaFields/integrations/integrationDependencyFieldUtils.ts:79:24)
at selectIntegrationDependencyVariables (src/components/fields/schemaFields/integrations/integrationDependencyFieldUtils.ts:93:16)
at recipe (node_modules/immer/src/core/immerClass.ts:94:14)
at produceExcludeUnusedDependencies (src/components/fields/schemaFields/integrations/integrationDependencyFieldUtils.ts:106:17)
at setIntegrationAuthSelectionForField (src/components/fields/schemaFields/integrations/IntegrationDependencyWidget.tsx:158:47)
at setIntegrationAuthSelectionForField (src/components/fields/schemaFields/integrations/IntegrationDependencyWidget.tsx:244:20)
at onChange (src/components/form/widgets/SelectWidget.tsx:110:5)
at node_modules/react-select/dist/useStateManager-7748b351.cjs.dev.js:38:7
at Select._this.onChange (node_modules/react-select/dist/Select-d63eed7b.cjs.dev.js:1263:7)
at Select._this.setValue (node_modules/react-select/dist/Select-d63eed7b.cjs.dev.js:1284:13)
at Select._this.selectOption (node_modules/react-select/dist/Select-d63eed7b.cjs.dev.js:1307:17)
at onSelect (node_modules/react-select/dist/Select-d63eed7b.cjs.dev.js:2391:25)
at HTMLUnknownElement.callCallback (node_modules/react-dom/cjs/react-dom.development.js:3945:14)
at Object.invokeGuardedCallbackDev (node_modules/react-dom/cjs/react-dom.development.js:3994:16)
at invokeGuardedCallback (node_modules/react-dom/cjs/react-dom.development.js:4056:31)
at invokeGuardedCallbackAndCatchFirstError (node_modules/react-dom/cjs/react-dom.development.js:4070:25)
at executeDispatch (node_modules/react-dom/cjs/react-dom.development.js:8243:3)
at processDispatchQueueItemsInOrder (node_modules/react-dom/cjs/react-dom.development.js:8275:7)
at processDispatchQueue (node_modules/react-dom/cjs/react-dom.development.js:8288:5)
at dispatchEventsForPlugins (node_modules/react-dom/cjs/react-dom.development.js:8299:3)
at node_modules/react-dom/cjs/react-dom.development.js:8508:12
at batchedEventUpdates$1 (node_modules/react-dom/cjs/react-dom.development.js:22396:12)
at batchedEventUpdates (node_modules/react-dom/cjs/react-dom.development.js:3745:12)
at dispatchEventForPluginEventSystem (node_modules/react-dom/cjs/react-dom.development.js:8507:3)
at attemptToDispatchEvent (node_modules/react-dom/cjs/react-dom.development.js:6005:3)
at dispatchEvent (node_modules/react-dom/cjs/react-dom.development.js:5924:19)
at unstable_runWithPriority (node_modules/scheduler/cjs/scheduler.development.js:468:12)
at runWithPriority$1 (node_modules/react-dom/cjs/react-dom.development.js:11276:10)
at discreteUpdates$1 (node_modules/react-dom/cjs/react-dom.development.js:22413:14)
at discreteUpdates (node_modules/react-dom/cjs/react-dom.development.js:3756:12)
at dispatchDiscreteEvent (node_modules/react-dom/cjs/react-dom.development.js:5889:3)
at node_modules/@testing-library/dom/dist/events.js:25:20
at node_modules/@testing-library/react/dist/pure.js:66:16
at batchedUpdates$1 (node_modules/react-dom/cjs/react-dom.development.js:22380:12)
at act (node_modules/react-dom/cjs/react-dom-test-utils.development.js:1042:14)
at Object.eventWrapper (node_modules/@testing-library/react/dist/pure.js:65:28)
at fireEvent (node_modules/@testing-library/dom/dist/events.js:16:35)
at Function.fireEvent.<computed> [as click] (node_modules/@testing-library/dom/dist/events.js:125:36)
at node_modules/react-select-event/lib/react-select-event.cjs.js:105:21
at batchedUpdates$1 (node_modules/react-dom/cjs/react-dom.development.js:22380:12)
at act (node_modules/react-dom/cjs/react-dom-test-utils.development.js:1042:14)
at Object.select (node_modules/react-select-event/lib/react-select-event.cjs.js:100:5)
at src/components/fields/schemaFields/integrations/IntegrationDependencyWidget.test.tsx:210:7
|
This job failed
Loading