Skip to content

Chore/add component library #126

Chore/add component library

Chore/add component library #126

Triggered via pull request July 20, 2024 17:27
Status Failure
Total duration 26s
Artifacts

frontend-ci.yaml

on: pull_request
Fit to window
Zoom out
Zoom in

Annotations

6 errors
src/App.test.tsx > App > should render the login page after clicked on the login link: frontend/src/App.test.tsx#L24
TestingLibraryElementError: Unable to find an accessible element with the role "heading" and name `/login/i` Here are the accessible roles: link: Name "Home": <a class="chakra-link css-ycmkp3" href="/" /> Name "Login": <a class="chakra-link css-1kre11v" href="/login" /> Name "Register": <a class="chakra-link css-1kre11v" href="/register" /> -------------------------------------------------- button: Name "": <button class="chakra-button css-4xx2wk" type="button" /> -------------------------------------------------- heading: Name "Home": <h1 /> -------------------------------------------------- paragraph: Name "": <p /> -------------------------------------------------- Ignored nodes: comments, script, style <body> <div> <div class="css-11h9hc7" > <div class="css-1e8m7dk" > <a class="chakra-link css-ycmkp3" href="/" > Home </a> <div class="css-17xejub" /> <a class="chakra-link css-1kre11v" href="/login" > Login </a> <div class="css-17xejub" /> <a class="chakra-link css-1kre11v" href="/register" > Register </a> <div class="css-17xejub" /> <button class="chakra-button css-4xx2wk" type="button" > <svg class="chakra-icon css-onkibi" focusable="false" viewBox="0 0 24 24" > <g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" > <circle cx="12" cy="12" r="5" /> <path d="M12 1v2" /> <path d="M12 21v2" /> <path d="M4.22 4.22l1.42 1.42" /> <path d="M18.36 18.36l1.42 1.42" /> <path d="M1 12h2" /> <path d="M21 12h2" /> <path d="M4.22 19.78l1.42-1.42" /> <path d="M18.36 5.64l1.42-1.42" /> </g> </svg> </button> </div> <div class="css-1w44gew" > <h1> Home </h1> <p> Welcome to Gilmore Devs Pet Clinic! </p> </div> <div class="css-k008qs" > Footer </div> </div> </div> </body> ❯ Object.getElementError node_modules/@testing-library/dom/dist/config.js:37:19 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:76:38 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:52:17 ❯ getByRole node_modules/@testing-library/dom/dist/query-helpers.js:95:19 ❯ src/App.test.tsx:24:16
src/App.test.tsx > App > should render the main page after visited the register page and clicked on the home link: frontend/src/App.test.tsx#L31
TestingLibraryElementError: Unable to find an accessible element with the role "link" and name `/main/i` Here are the accessible roles: link: Name "Home": <a class="chakra-link css-ycmkp3" href="/" /> Name "Login": <a class="chakra-link css-1kre11v" href="/login" /> Name "Register": <a class="chakra-link css-1kre11v" href="/register" /> -------------------------------------------------- button: Name "": <button class="chakra-button css-4xx2wk" type="button" /> -------------------------------------------------- heading: Name "Home": <h1 /> -------------------------------------------------- paragraph: Name "": <p /> -------------------------------------------------- Ignored nodes: comments, script, style <body> <div> <div class="css-11h9hc7" > <div class="css-1e8m7dk" > <a class="chakra-link css-ycmkp3" href="/" > Home </a> <div class="css-17xejub" /> <a class="chakra-link css-1kre11v" href="/login" > Login </a> <div class="css-17xejub" /> <a class="chakra-link css-1kre11v" href="/register" > Register </a> <div class="css-17xejub" /> <button class="chakra-button css-4xx2wk" type="button" > <svg class="chakra-icon css-onkibi" focusable="false" viewBox="0 0 24 24" > <g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" > <circle cx="12" cy="12" r="5" /> <path d="M12 1v2" /> <path d="M12 21v2" /> <path d="M4.22 4.22l1.42 1.42" /> <path d="M18.36 18.36l1.42 1.42" /> <path d="M1 12h2" /> <path d="M21 12h2" /> <path d="M4.22 19.78l1.42-1.42" /> <path d="M18.36 5.64l1.42-1.42" /> </g> </svg> </button> </div> <div class="css-1w44gew" > <h1> Home </h1> <p> Welcome to Gilmore Devs Pet Clinic! </p> </div> <div class="css-k008qs" > Footer </div> </div> </div> </body> ❯ Object.getElementError node_modules/@testing-library/dom/dist/config.js:37:19 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:76:38 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:52:17 ❯ getByRole node_modules/@testing-library/dom/dist/query-helpers.js:95:19 ❯ src/App.test.tsx:31:13 ❯ Proxy.act node_modules/react/cjs/react.development.js:2512:16 ❯ src/App.test.tsx:30:9
src/App.test.tsx > App > should render the register page after clicked on the register link: frontend/src/App.test.tsx#L43
TestingLibraryElementError: Unable to find an accessible element with the role "heading" and name `/register/i` Here are the accessible roles: link: Name "Home": <a class="chakra-link css-ycmkp3" href="/" /> Name "Login": <a class="chakra-link css-1kre11v" href="/login" /> Name "Register": <a class="chakra-link css-1kre11v" href="/register" /> -------------------------------------------------- button: Name "": <button class="chakra-button css-4xx2wk" type="button" /> -------------------------------------------------- heading: Name "Home": <h1 /> -------------------------------------------------- paragraph: Name "": <p /> -------------------------------------------------- Ignored nodes: comments, script, style <body> <div> <div class="css-11h9hc7" > <div class="css-1e8m7dk" > <a class="chakra-link css-ycmkp3" href="/" > Home </a> <div class="css-17xejub" /> <a class="chakra-link css-1kre11v" href="/login" > Login </a> <div class="css-17xejub" /> <a class="chakra-link css-1kre11v" href="/register" > Register </a> <div class="css-17xejub" /> <button class="chakra-button css-4xx2wk" type="button" > <svg class="chakra-icon css-onkibi" focusable="false" viewBox="0 0 24 24" > <g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" > <circle cx="12" cy="12" r="5" /> <path d="M12 1v2" /> <path d="M12 21v2" /> <path d="M4.22 4.22l1.42 1.42" /> <path d="M18.36 18.36l1.42 1.42" /> <path d="M1 12h2" /> <path d="M21 12h2" /> <path d="M4.22 19.78l1.42-1.42" /> <path d="M18.36 5.64l1.42-1.42" /> </g> </svg> </button> </div> <div class="css-1w44gew" > <h1> Home </h1> <p> Welcome to Gilmore Devs Pet Clinic! </p> </div> <div class="css-k008qs" > Footer </div> </div> </div> </body> ❯ Object.getElementError node_modules/@testing-library/dom/dist/config.js:37:19 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:76:38 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:52:17 ❯ getByRole node_modules/@testing-library/dom/dist/query-helpers.js:95:19 ❯ src/App.test.tsx:43:16
src/pages/Login.test.tsx > Register component > sends an HTTP request, when Submit is clicked: frontend/src/pages/Login.test.tsx#L46
AssertionError: expected "spy" to be called at least once ❯ src/pages/Login.test.tsx:46:21
src/pages/Register.test.tsx > Register component > has initial password errors if nothing is added as password: frontend/src/pages/Register.test.tsx#L29
TestingLibraryElementError: Unable to find a label with the text of: passworderrors Ignored nodes: comments, script, style <body> <div> <h1> Register </h1> <form> <label class="chakra-form__label css-uvho5g" for="firstName" > First Name: </label> <input aria-label="firstName" aria-required="true" autocomplete="given-name" class="chakra-input css-0" name="firstName" required="" type="text" value="" /> <label class="chakra-form__label css-uvho5g" for="lastName" > Last Name: </label> <input aria-label="lastName" aria-required="true" autocomplete="family-name" class="chakra-input css-0" name="lastName" required="" type="text" value="" /> <div class="chakra-form-control css-0" data-invalid="" role="group" > <label class="chakra-form__label css-uvho5g" data-invalid="" for="email" id="field-:r2:-label" > Email: </label> <input aria-describedby="field-:r2:-feedback" aria-invalid="true" aria-label="email" aria-required="true" autocomplete="email" class="chakra-input css-0" id="field-:r2:" name="email" required="" type="email" value="" /> <div aria-live="polite" class="chakra-form__error-message css-ttob5j" id="field-:r2:-feedback" > Please, enter a valid email! </div> </div> <div class="chakra-form-control css-0" data-invalid="" role="group" > <label class="chakra-form__label css-uvho5g" data-invalid="" for="password" id="field-:r3:-label" > Password: </label> <input aria-describedby="field-:r3:-feedback" aria-invalid="true" aria-label="pass" class="chakra-input css-0" id="field-:r3:" name="password" type="password" value="" /> <div aria-live="polite" class="chakra-form__error-message css-ttob5j" id="field-:r3:-feedback" > must be at least 8 characters long </div> <div aria-live="polite" class="chakra-form__error-message css-ttob5j" id="field-:r3:-feedback" > must contain at least one digit </div> <div aria-live="polite" class="chakra-form__error-message css-ttob5j" id="field-:r3:-feedback" > must contain at least one uppercase letter </div> <div aria-live="polite" class="chakra-form__error-message css-ttob5j" id="field-:r3:-feedback" > must contain at least one lowercase letter </div> </div> <button class="chakra-button css-4xx2wk" type="submit" > Register </button> </form> </div> </body> ❯ Object.getElementError node_modules/@testing-library/dom/dist/config.js:37:19 ❯ getAllByLabelText node_modules/@testing-library/dom/dist/queries/label-text.js:111:38 ❯ getAllByLabelText node_modules/@testing-library/dom/dist/query-helpers.js:109:15 ❯ src/pages/Register.test.tsx:29:39
build
Process completed with exit code 1.