dom-testing-library
dom-testing-library copied to clipboard
testing-library
userEvent.type('[email protected]'); is passing but expect(getByText('[email protected]')).toBeInTheDocument(); is giving error.
Pls see the result of Test run below.
C:\Users\udayarajan.gauthaman\MFE - Core\MFE - Core>jest input_valid__email.spec.js FAIL src/lib/Input/input_valid__email.spec.js × success (43 ms)
● success
ReferenceError: getByText is not defined
17 | userEvent.type('[email protected]');
18 |
> 19 | expect(getByText('[email protected]')).toBeInTheDocument();
| ^
20 | });
21 |
at Object.<anonymous> (src/lib/Input/input_valid__email.spec.js:19:5)
console.error
Error: Unable to find the "window" object for the given node. Please file an issue with the code that's causing you to see this error: https://github.com/testing-library/dom-testing-library/issues/new
at getWindowFromNode (C:\Users\udayarajan.gauthaman\MFE - Core\MFE - Core\node_modules@testing-library\dom\dist\helpers.js:56:11)
at hasPointerEvents (C:\Users\udayarajan.gauthaman\MFE - Core\MFE - Core\node_modules@testing-library\user-event\dist\utils\misc\hasPointerEvents.js:11:49)
at click (C:\Users\udayarajan.gauthaman\MFE - Core\MFE - Core\node_modules@testing-library\user-event\dist\click.js:116:63)
at typeImplementation (C:\Users\udayarajan.gauthaman\MFE - Core\MFE - Core\node_modules@testing-library\user-event\dist\type\typeImplementation.js:24:36)
at Object.type (C:\Users\udayarajan.gauthaman\MFE - Core\MFE - Core\node_modules@testing-library\user-event\dist\type\index.js:27:60)
at Object.
Test Suites: 1 failed, 1 total Tests: 1 failed, 1 total Snapshots: 0 total Time: 3.831 s, estimated 4 s Ran all test suites matching /input_valid__email.spec.js/i.
C:\Users\udayarajan.gauthaman\MFE - Core\MFE - Core>jest input_valid__email.spec.js FAIL src/lib/Input/input_valid__email.spec.js × success (66 ms)
● success
TestingLibraryElementError: Unable to find an element with the text: [email protected]. 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.
<body>
<div>
<input
class=""
data-testid="mainInput"
id="testme"
name="test"
placeholder=""
type="email"
/>
</div>
</body>
17 | userEvent.type('[email protected]');
18 |
> 19 | expect(screen.getByText('[email protected]')).toBeInTheDocument();
| ^
20 | });
21 |
at Object.getElementError (node_modules/@testing-library/svelte/node_modules/@testing-library/dom/dist/config.js:37:19)
at allQuery (node_modules/@testing-library/svelte/node_modules/@testing-library/dom/dist/query-helpers.js:90:38)
at query (node_modules/@testing-library/svelte/node_modules/@testing-library/dom/dist/query-helpers.js:62:17)
at getByText (node_modules/@testing-library/svelte/node_modules/@testing-library/dom/dist/query-helpers.js:111:19)
at Object.<anonymous> (src/lib/Input/input_valid__email.spec.js:19:19)
console.error
Error: Unable to find the "window" object for the given node. Please file an issue with the code that's causing you to see this error: https://github.com/testing-library/dom-testing-library/issues/new
at getWindowFromNode (C:\Users\udayarajan.gauthaman\MFE - Core\MFE - Core\node_modules@testing-library\dom\dist\helpers.js:56:11)
at hasPointerEvents (C:\Users\udayarajan.gauthaman\MFE - Core\MFE - Core\node_modules@testing-library\user-event\dist\utils\misc\hasPointerEvents.js:11:49)
at click (C:\Users\udayarajan.gauthaman\MFE - Core\MFE - Core\node_modules@testing-library\user-event\dist\click.js:116:63)
at typeImplementation (C:\Users\udayarajan.gauthaman\MFE - Core\MFE - Core\node_modules@testing-library\user-event\dist\type\typeImplementation.js:24:36)
at Object.type (C:\Users\udayarajan.gauthaman\MFE - Core\MFE - Core\node_modules@testing-library\user-event\dist\type\index.js:27:60)
at Object.
Test Suites: 1 failed, 1 total Tests: 1 failed, 1 total Snapshots: 0 total Time: 3.892 s, estimated 4 s Ran all test suites matching /input_valid__email.spec.js/i.
My Test leader is telling internal logic of components cannot be Tested in Svelte Library.Is it true.
Following are other scenarios which I cannot Test using Testing library.
const breadcrumb1 = getByText('Home');
const breadcrumb2 = getByText('Bathroom');
const breadcrumb3 = getByText('Bathroom Fixtures');
const breadcrumb4 = getByText('DHP Rosemary 30” Bathroom Vanity');
expect(breadcrumb1).toBeInTheDocument();
expect(breadcrumb2).toBeInTheDocument();
expect(breadcrumb3).toBeInTheDocument();
expect(breadcrumb4).toBeInTheDocument();
fireEvent.click(breadcrumb2);
expect(breadcrumb1).toBeInTheDocument();
expect(breadcrumb2).toBeInTheDocument();
// The below 2 two Test i.e Bathroom Fixtures and DHP Rosemary 30” Bathroom Vanity not to be in
// the Document after clicking on BreadCrumb2 i.e Bathroom Fixtures cannot be Tested as certain internal
// life cycle methods cannot be Tested using Svelte Testing Library(Jest).This is its Limitation as
// per Zach Pulkin
console.log('Below Failure is expected as Internal Life Cycle methods cannot be Tested as per Zach Pulkin');
expect(breadcrumb3).not.toBeInTheDocument(); [NOT PASSING]
expect(breadcrumb4).not.toBeInTheDocument(); [NOT PASSING.
2.const { checkboxdata } = render(CheckboxGroup, { data: checkboxGroupData.colors.data, type: checkboxGroupData.colors.options, selected: checkboxGroupData.colors.selected });
const blue = screen.getByText('Blue');
expect(blue).toBeInTheDocument();
fireEvent.click(blue);
expect(blue).toBeInTheDocument();
//The below cannot be Tested as it depends on the Life Cycle method of
//a component and is a limitation of Svelte Testing Library(Jest).
console.log(
'The below failure is expected as internal life cycle method of a component cannot be Tested and is a Limitation of' +
'Svelte Testing Library and Jest as per Zach Pulkin'
);
expect(checkboxdata.selected).toBe(true); [NOT PASSING]
});
const { getByTestId } = render(Input, { id: 'testme', name: 'test', type: 'text', maxlength: 5 });
const mainInput = getByTestId('mainInput');
expect(mainInput).toBeInTheDocument();
expect(mainInput).toHaveAttribute('id', 'testme');
expect(mainInput).toHaveAttribute('name', 'test');
expect(mainInput).toHaveAttribute('type', 'text');
expect(mainInput).toHaveAttribute('maxlength', '5');
//expect(screen.getByText('password')).toBeInTheDocument();
console.log(
'Above is not Testable-Limitation of Svelte Testing Library according to Zach Pulkin Have Tested in Storybook'
);
userEvent.type(mainInput, 'h123');
expect(screen.getByText('h123')).toBeInTheDocument();
userEvent.type(mainInput, 'h123456');
expect(screen.getByText('h123456')).not.toBeInTheDocument();[NOT PASSING]
Hi @kcs-udayarajangauthaman. I'm sorry but this issue doesn't follow our template and it's really hard for us to understand what's the specific issue you're raising here.
A reproducible codesandbox will be good for us to start looking into the issue. You need to understand that we need all the details in order to look into stuff so we can help.
Thanks.
@kcs-udayarajangauthaman
getByText: Outside of forms, text content is the main way users find elements. This method can be used to find non-interactive elements (like divs, spans, and paragraphs).
As per the docs, you cant use getByText to query by the value of an input (input value="something" /) getByText("something") won't work.
