Skip to content

#8579 & #8614: Migrate mod component form state #20905

#8579 & #8614: Migrate mod component form state

#8579 & #8614: Migrate mod component form state #20905

Triggered via pull request July 1, 2024 15:47
Status Failure
Total duration 16m 8s
Artifacts 5

ci.yml

on: pull_request
Matrix: end-to-end-tests / run-tests
Create report
24s
Create report
upload-to-codecov
0s
upload-to-codecov
Fit to window
Zoom out
Zoom in

Annotations

10 errors and 1 warning
renders › a mod component with sub pipeline: 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)
ConnectedFieldTemplate › page editor analysis context › shows analysis error: 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)
ConnectedFieldTemplate › page editor analysis context › shows both formik and analysis error: 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)
ConnectedFieldTemplate › page editor analysis context › shows multiple analysis errors: 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)
ConnectedFieldTemplate › page editor analysis context › does not show analysis error annotation when the annotation detail does not match the field value: 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)
RequireIntegrationConfig › shows auth options and renders children when option is selected: 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>
RequireIntegrationConfig › does not show children and shows error alert when integration auth is not valid: 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
ServiceWidget › should default to only configuration: 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)
ServiceWidget › should default to only configuration: 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
ServiceWidget › allow any for HTTP Request brick: 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
prettier
The `python-version` input is not set. The version of Python currently in `PATH` will be used.

Artifacts

Produced during runtime
Name Size
brick-headers Expired
16.7 KB
build-staging-bundle-dependency-report Expired
543 KB
end-to-end-tests-report Expired
259 KB
end-to-end-tests-report-chrome Expired
125 KB
end-to-end-tests-report-edge Expired
126 KB