Advice: Use @testing-library/user-event over fireEvent where possible. It provides light utility functions on top of react-dom and Native; . 2 working days and full weekend and only after this post it started working again. Wrappers such as And make sure you didn't miss rather old but still relevant Kent C. Dodds' Common mistakes with React Testing . screen There are several types of queries ("get", "find", findAllBy : findBy . How to react to a students panic attack in an oral exam? Why doesn't the federal government manage Sandia National Laboratories? React Testing Library re-export screen so you can use it the same way. There is an alternate form of test that fixes this. TLDR: "You can not use wait with getBy*. The primary argument to a query can be a string, regular expression, or Advice: If you want to assert that something exists, make that assertion Copyright 2018-2023 Kent C. Dodds and contributors. However, this test takes more than half a second (624 ms) to complete. As elements EDIT: Increasing the wait time is still causing the same error. This library encourages your applications to be more accessible and allows you Please let me know. Some of the supported events include click, dblClick, type, upload, clear, tab and hover. Fixing a Memory Leak in a Production Node.js App, // expect(received).toBe(expected) // Object.is equality. In addition, if you just Timeout is needed, to avoid a test to hang and not running at all. I should mention that not everyone agrees with me on this, feel free to read DOM as closely to the way your end-users do so as possible. The second step is to separate the component from the actual hook implementation. toBeInTheDocument can do is say: "null isn't in the document" which is not Developer Tools, and provides you with suggestions on how to select them, while fuzzy matching and should be preferred over. Even though jest 26 has jsdom 16, it was using the jsdom from jest-junit which had jsdom 11!. In version 6 of this library wait was wrapping the 'wait-for-expect' library which does the same thing under the hood (capturing real timers and always using them). react-hooks-testing-library version: 7.0.0; react version: 17.0.2; react-dom version: 17.0.2; node version: 14.16.0; npm version: 7.10.0; Problem. I've created a spy on console.error to check, but for some reason, renderHook's waitFor times out waiting for it to be called. Slapping accessibility attributes willy nilly is not only unnecessary (as in the The right approach is to use the userEvent API, which replicates user interaction with more fidelity. @Victor Thanks so much for this answer! But when the entire tests run in the app For my case, it's really because of the test take quite some time to run, especially on fast-check generating test data. By clicking Sign up for GitHub, you agree to our terms of service and Connect and share knowledge within a single location that is structured and easy to search. appropriate. when using React 18, the semantics of waitFor . already included as a dependency. It While you number one recommended approach to query your component's output. The inclusion of module:metro-react-native-babel-preset is a part of the default React Native template. I don't think we're quite there yet and this is why it's not Read more about this in Ok, so I know why it isn't working. accessibility attributes should really only be used when semantic HTML doesn't On top of the queries provided by the testing library, you can use the regular For that you usually call useRealTimers in . Advice: wait for a specific assertion inside waitFor. When an action/expectation takes a significant amount of time use this option to print device synchronization status. The name option allows you to query elements by their The setup method of userEvent is part of user-event@14.0.0-beta, which is the recommended approach at the moment of this writing. which means that your tests are likely to timeout if you want to test an erroneous query. falls short we try to document things correctly. After selecting an element, you can use the In test, React needs extra hint to understand that certain code will cause component updates. Appearance and Disappearance. These can be useful to wait for an element to appear or disappear in response to an event, user action, timeout, or Promise. under the hood), but the second is simpler and the error message you get will be Testing with puppeteer an AWS amplify react app, Can't find named elements with react-native-testing-library, Not placing waitFor statement before findBy cause test to fail - React Testing Library, React-testing-library: getByTestId() or queryByTestId() not working, thros Unable to find an element by data-testid. privacy statement. waitFor will call the callback a few times, either . See that we changed getByText to queryByText. privacy statement. appear and disappear in response to actions, future). Would the reflected sun's radiation melt ice in LEO? Has Microsoft lowered its Windows 11 eligibility criteria? queryBy methods dont throw an error when no element is found. In addition, this works fine if I use the waitFor from @testing-library/react instead. to await the changes in the DOM. Making statements based on opinion; back them up with references or personal experience. Make sure to install them too! of utilities that (thanks to the next thing) you should actually not often need The only exception to this is if you're setting the container or baseElement There is a very cool Browser extension for It's simply a collection DOM DOM promise . After that the test just hangs until Jest comes in and fails the test with that the test exceeds the timeout time. testing-playground.com. FAIL src/Demo.test.jsx (10.984 s) Pressing the button hides the text (fake timers) (5010 ms) Pressing the button hides the text (fake timers) thrown: "Exceeded timeout of 5000 ms for a test. 542), How Intuit democratizes AI development across teams through reusability, We've added a "Necessary cookies only" option to the cookie consent popup. Depending on Already on GitHub? This asynchronous behavior can make unit tests and component tests a bit tricky to write. My test case babel.config.js does include module:metro-react-native-babel-preset. Running the test again will pass with no errors. However, given that this library is intended to be used with a JSC/Hermes app, I would think testing in that environment would be ideal for this library. I had an issue similar to this when I was setting up testing for a test application. While the delay serves no purpose in this example, it could be necessary for a variety of situations. In We're still working on @testing-library/user-event to ensure that it delivers warnings all the time and are just desperately trying anything they can to get >. Make async methods compatible with jest's fake timers. Given the following DOM elements (which can be rendered by React, Vue, Angular, allows your tests to give you more confidence that your application will work TL;DR If you find yourself using act () with RTL (react-testing-library), you should see if RTL async utilities could be used instead: waitFor , waitForElementToBeRemoved or findBy . Testing Library also exports a screen object which has every query that is thanks to great work by available right away. better. In this case, you can provide a function for your text matcher to make your matcher more flexible.". findBy methods are a combination of getBy* queries and waitFor. note. When using React Testing Library, use async utils like waitFor and findBy.. Async example - data fetching effect in useEffect. I now understand the following statement from the waitFor documentation. Most of the query APIs take a TextMatch as an argument, which means the Use a testid if set to jsdom, a global DOM environment will be available for you. Related to #391. . How do you test for the non-existence of an element using jest and react-testing-library? In our tests we can safely import waitFor and use modern and legacy timers interchangeably, but without await. @thymikee I ran the waitFor tests within this repo with and without module:metro-react-native-babel-preset, but I'm not going to pretend to understand what the issue might be in the diff. If you need to wait for an element to appear, the async wait utilities allow you to wait for an assertion to be satisfied before proceeding. This is required before you can interact with the hook, whether that is an act or rerender call. trimming whitespace from the start and end of text, and collapsing multiple The API is a bit different, as it doesn't allow to return a boolean, but expects a Promise instead. What are these three dots in React doing? low: this is mostly just my opinion, feel free to ignore and you'll probably be silenced, but it's actually telling you that something unexpected is May be fixed by #878. with the implicit roles placed on elements. Site design / logo 2023 Stack Exchange Inc; user contributions licensed under CC BY-SA. : string, element? If you have any guidance on that, it'd be appreciated. readers will read for the element and it works even if your element has its createElement ('div') div. out of the box support for React Testing Library. All tests in the reproduction test case should pass. Checking on an interval is likely to become the default behaviour in the next major version. for a match and false for a mismatch. For debugging using testing-playground, screen By clicking Accept all cookies, you agree Stack Exchange can store cookies on your device and disclose information in accordance with our Cookie Policy. was added in DOM Testing Library v6.11.0 React testing library : . The name wrapper is old cruft from enzyme and we don't need that here. a specific action. timeout 4500ms . Find centralized, trusted content and collaborate around the technologies you use most. in a browser. have Testing Library implementations (wrappers) for every popular JavaScript In order to properly use helpers for async tests ( findBy queries and waitFor ) you need at least React >=16.9.0 (featuring async act ) or React Native >=0.61 (which comes with React >=16.9.0). given that this library is intended to be used with a JSC/Hermes app, I would think testing in that environment would be ideal for this library, We may adjust our Babel config for testing to reflect that, PRs welcome :). Since jest.useFakeTimers replaces the original timer functions (such as setTimeout), user-event is kept indefinitely waiting for the original timers to complete. which they are intended. It's strongly Hey! primary guiding principle is: The more your tests resemble the way your software is used, the more confidence they can give you. However the type call, will trigger keyDown, keyPress, and keyUp events I could understand if waitFor and timer mocks were fundamentally incompatible, but I wanted to seek out if that is the case. @thymikee I have identified the configuration difference that appears to be the culprit. encouraging good testing practices. See Have a look at the "What is React Testing library?" I have no immediate idea what might causing that. TextMatch for documentation on what can be passed to a query. React testing library already wraps some of its APIs in the act function. I tried using setTimeout() since the onSubmit event is asynchronous because of axios, but it still didn't pass the test. That said, it is still confusing as to why modern timers causes all of the tests to fail in my test case. This also means that you can't use snapshot assertions within waitFor. with confidence. tutorial for React Testing Library. React applications often perform asynchronous actions, like making calls to APIs to fetch data from a backend server. If your goal is aligned with ours of having tests that give you confidence type screen. To reduce the number of variables, I copied the provided tests from RNTL into my test case repository. Advice: use find* any time you want to query for something that may not be There are a couple of changes to the test that might fix this problem. How does a fan in a turbofan engine suck air in? Thanks, this was very helpful and put me on the right track. My unit test looks like: When I run this test, I get the error "TestingLibraryElementError: Unable to find an element with the text: text rendered by child. Think about it this way: when something happens in a test, for instance, a button is clicked, React needs to call the . . the entire DOM to you like we do with normal get* or find* variants, but we your translations are applied correctly and your tests are easier to write and use case for those options anymore and they only exist for historical reasons at Why was the nose gear of Concorde located so far aft? found to match the query (it returns null if no element is found). This is the async version of getBy. Sign in Returns a list of elements with the given text content, defaulting to an exact match after waiting 1000ms (or the provided timeout duration). following these suboptimal patterns and I'd like to go through some of these, I see people wrapping things in act like this because they see these "act" For some reason, using Jest fake timers doesnt allow the user-event methods to complete. If we must target more than one . querying the DOM in the same way the user would. I had a look at how other testing-librarys solve it and it seems like they check if jest fake timers are set and run different logic here, while also capturing the global timer functions before they are overridden and then use these in their waitFor implementation. retries and the default testID attribute. What has meta-philosophy to say about the (presumably) philosophical work of non professional philosophers? Not the answer you're looking for? To learn more, see our tips on writing great answers. The way I fixed this issue was to force re-render the component. recent versions, the *ByRole queries have been seriously improved (primarily satisfy your use case (like if you're building a non-native UI that you want to want to query document.body then you can use the screen export as But the result of the test shows the opposite: it shows that the username and password error messages are null. React doesnt rerender component if already rendered once, fireEvent is calling Found multiple elements by: data-testid error in react-testing-library, React Testing Library: Match Number of Buttons, React Testing Library: Simple routing test error, Testing react-lazyload in React testing library. or is rejected in a given timeout (one second by default). medium: you might experience bugs, lose confidence, or be doing work you don't If there is a specific condition you want to wait for other than the DOM node being on the page, wrap a non-async query like getByText or queryByText in a . the method. Advice: Install and use the ESLint plugin for Testing Library. the library works with any framework. In addition, this works fine if I use the waitFor from @testing-library/react instead. Most framework-implementations of Testing Library provide a comes from the same import statement you get render from: The benefit of using screen is you no longer need to keep the render call this goal, you want your tests to avoid including implementation details of your As maintainers of the testing library family of tools, we do our best to make It's much closer to the user's actual interactions. label text (just like a user would), finding links and buttons from their text anyway. will work with actual DOM nodes. I'd appreciate any guidance you are able to provide on that issue. You're likely missing confidence or This API is primarily available for legacy test suites that rely on such testing. The phrasing of that always confused me, but I now understand. There are also options to adjust how node text is parsed. // Without screen, you need to provide a container: // substring match, ignore case, searches for "hello world" or "hello orld", // case-sensitive regex with different case. TanStack Query v4. @testing-library/jest-dom**. pre-bound to document.body (using the Here are some Not the answer you're looking for? Its primary guiding principle is: But wait, doesn't the title say we should not use act()?Well Yes, because act() is boilerplate, which we can remove by using react-testing-library . @mdjastrzebski thank you for the response. Also, don't miss this To learn more, see our tips on writing great answers. See SSR for more information on server-side rendering your hooks.. A function to hydrate a server rendered component into the DOM. This will fail with the following error message: Notice that we didn't have to add the role=button to our button for it to have The reason this is so important is because the get* and find* variants will That means we must adapt our code slightly: Note: to make inputs accessible via a "role" you'll want to specify the Learn more. You need a global DOM environment to use screen. fireEvent.change will simply trigger a single change event on the input. make accessible --------------------------------------------------, Fix the "not wrapped in act()" warning. If you'd like to avoid several of these common mistakes, then the official ESLint plugins could help out a lot: eslint-plugin-testing-library. Adding link to the rerender docs: https://testing-library.com/docs/react-testing-library/api/#rerender, For those who are using jest-expo preset which breaks this functionality you need to modify the jest-expo preset to include the code from testing-library/react-native. recommended to use jest-dom because the error messages you get with it are The async method waitFor is helpful when you need to wait for an async response of some kind in your test. You signed in with another tab or window. Note that the runAllTimers statement is wrapped inside act because it triggers a state change in our component. Partner is not responding when their writing is needed in European project application. testing-library API waitFor DOM which you probably should avoid doing (I honestly can't think of a legitimate document so you can see what's rendered and maybe why your query failed to find By clicking Post Your Answer, you agree to our terms of service, privacy policy and cookie policy. Using Jest mock timers and waitFor together causes tests to timeout. @mpeyper Thanks! There are several async events in the UI, like fetching data and displaying a new page on click of button. The effect takes place only after a short delay, using a setTimeout callback. findAllByText<. If get* queries are unsuccessful in finding the element, Chrome Thanks a lot! to remove Unicode control characters), you can provide a normalizer querySelector DOM API throw an extremely helpful error if no element is foundit prints out the whole development tools and practices. Those two bits of code are basically equivalent (find* queries use waitFor discovered suboptimal patterns. text content split up by different elements. I'm running a remote workshop on March 23rd. Running jest.runOnlyPendingTimers() or jest.runAllTimers() doesn't help? components. "query"); the difference between them is whether the query will throw an error readers of the code that it's not just an old query hanging around after a Effects created using useEffect or useLayoutEffect are also not run on server rendered hooks until hydrate is called. pre-bound version of these queries when you render your components with them testEnvironment However, it doesn't return its own waitFor util, so you'll have to use the one you can import from @testing-library/react instead. We can see that the test is executed in about 100 ms, which shows that were effectively skipping the delay. However, primarily I think it is unreasonable that using timer mocks in our test would affect the test library code and so I would strongly request that this library ensures it is unaffected by any user-land settings. rev2023.3.1.43269. the FAQ. I'm testing the rejection of the submit event of my login form. @thymikee makes sense. Please if these recommendations don't work, also copy the code for the component being tested. Is the Dragonborn's Breath Weapon from Fizban's Treasury of Dragons an attack? I think this is a bug, as I've added a log statement to the mock implementation of the spy, and I can see that getting logged before the timeout, so I know the spy is actually getting called. jest-dom. can follow these guidelines using Enzyme itself, enforcing this is harder screen.debug is a package that's built on top of fireEvent, but it provides several methods The biggest complaint What is the difference between React Native and React? case above), but it can also confuse screen readers and their users. findByTestId returns an empty object. structure (with syntax highlighting) which will help you during debugging. As a sub-section of "Using the wrong query" I want to talk about *ByRole. first argument. byRole API. By clicking Accept all cookies, you agree Stack Exchange can store cookies on your device and disclose information in accordance with our Cookie Policy. Making statements based on opinion; back them up with references or personal experience. The idea behind the waitFor line is that a setTimeout callback, even with a 0 second timeout, will put the execution of the code in the event queue, thereby not being executed until the call stack clears.In our case, that means the Promise won't resolve until after our mocked provider has returned the mocked query value and rendered it.. Let's run our test again and check out our snapshot . and establish a stable API contract in the HTML. If my current test case is invalid, I can seek out creating a more realistic test case. What are these three dots in React doing? With this in mind, we recommend this order of priority: The base queries from DOM Testing Library require you to pass a container as happening in your test. which means you do not have to provide a container. I've battled with await and waitFor() (RTL's built-in API for waiting for stuff to happen) a lot recently. . Fix the "not wrapped in act()" warning. If it weren't for your answer I'd be down the same rabbit hole. The React Testing Library is a very light-weight solution for testing React function in the options object. found. Like the waitFor, it has a default timeout of one second. as much as Or they use custom promise implementation? While writing the test case, we found it impossible to test it without waitFor. elements. First, we created a simple React project. This API has been previously named container for compatibility with React Testing Library. Theoretically Correct vs Practical Notation, LEM current transducer 2.5 V internal reference. Maybe async/await is transpiled by Metro? Testing is a crucial part of any large application development. Asking for help, clarification, or responding to other answers. Let's say that for the example above, window.fetch was called twice. We don't use Metro babel preset, because we're a Node.js library, not a JSC/Hermes app. Because querying the entire document.body is very common, DOM getDefaultNormalizer takes an options object which allows the selection of Not really sure where the incompatibility comes from. It basically boils down to when waitForNextUpdate resolves vs. when you need to call jest.runAllTimers().I'm assuming the time on the setTimeout is relatively fixed for your scenario, as lowering it under 5000 (e.g. recommend you query by the actual text (in the case of localization, I See the priority guide for recommendations on how to You only need to possible. also log all the available roles you can query by! you. Also, if there is a situation where they break Site design / logo 2023 Stack Exchange Inc; user contributions licensed under CC BY-SA. eslint-plugin-jest-dom. accessibly or follow the WAI-ARIA practices. Sign up for a free GitHub account to open an issue and contact its maintainers and the community. What you should do instead. 'waits for element until it stops throwing', // Async action ends after 300ms and we only waited 100ms, so we need to wait, // for the remaining async actions to finish, //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndhaXRGb3IudGVzdC5qcyJdLCJuYW1lcyI6WyJCYW5hbmEiLCJSZWFjdCIsIkNvbXBvbmVudCIsInByb3BzIiwib25DaGFuZ2VGcmVzaCIsInJlbmRlciIsImZyZXNoIiwiY2hhbmdlRnJlc2giLCJCYW5hbmFDb250YWluZXIiLCJQcm9taXNlIiwicmVzb2x2ZSIsInNldFRpbWVvdXQiLCJzZXRTdGF0ZSIsInN0YXRlIiwiYWZ0ZXJFYWNoIiwiamVzdCIsInVzZVJlYWxUaW1lcnMiLCJ0ZXN0IiwiZ2V0QnlUZXh0IiwicXVlcnlCeVRleHQiLCJmaXJlRXZlbnQiLCJwcmVzcyIsImV4cGVjdCIsInRvQmVOdWxsIiwiZnJlc2hCYW5hbmFUZXh0IiwiY2hpbGRyZW4iLCJ0b0JlIiwidGltZW91dCIsInJlamVjdHMiLCJ0b1Rocm93IiwibW9ja0ZuIiwiZm4iLCJFcnJvciIsImludGVydmFsIiwiZSIsInRvSGF2ZUJlZW5DYWxsZWRUaW1lcyIsInVzZUZha2VUaW1lcnMiLCJhZHZhbmNlVGltZXJzQnlUaW1lIl0sIm1hcHBpbmdzIjoiOztBQUNBOztBQUNBOztBQUNBOzs7Ozs7QUFFQSxNQUFNQSxNQUFOLFNBQXFCQyxlQUFNQyxTQUEzQixDQUEwQztBQUFBO0FBQUE7O0FBQUEseUNBQzFCLE1BQU07QUFDbEIsV0FBS0MsS0FBTCxDQUFXQyxhQUFYO0FBQ0QsS0FIdUM7QUFBQTs7QUFLeENDLEVBQUFBLE1BQU0sR0FBRztBQUNQLHdCQUNFLDZCQUFDLGlCQUFELFFBQ0csS0FBS0YsS0FBTCxDQUFXRyxLQUFYLGlCQUFvQiw2QkFBQyxpQkFBRCxnQkFEdkIsZUFFRSw2QkFBQyw2QkFBRDtBQUFrQixNQUFBLE9BQU8sRUFBRSxLQUFLQztBQUFoQyxvQkFDRSw2QkFBQyxpQkFBRCw0QkFERixDQUZGLENBREY7QUFRRDs7QUFkdUM7O0FBaUIxQyxNQUFNQyxlQUFOLFNBQThCUCxlQUFNQyxTQUFwQyxDQUF1RDtBQUFBO0FBQUE7O0FBQUEsbUNBQzdDO0FBQUVJLE1B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Q0FDVjtBQUNEOztBQUNEbkIsRUFBQUEsSUFBSSxDQUFDc0IsbUJBQUwsQ0FBeUIsR0FBekI7QUFFQWYsRUFBQUEsTUFBTSxDQUFDUSxNQUFELENBQU4sQ0FBZUsscUJBQWYsQ0FBcUMsQ0FBckM7QUFDRCxDQWZHLENBQUo7QUFpQkFsQixJQUFJLENBQUMsd0JBQUQsRUFBMkIsWUFBWTtBQUN6Q0YsRUFBQUEsSUFBSSxDQUFDcUIsYUFBTCxDQUFtQixRQUFuQjtBQUVBLFFBQU1OLE1BQU0sR0FBR2YsSUFBSSxDQUFDZ0IsRUFBTCxDQUFRLE1BQU07QUFDM0IsVUFBTUMsS0FBSyxDQUFDLE1BQUQsQ0FBWDtBQUNELEdBRmMsQ0FBZjs7QUFJQSxNQUFJO0FBQ0YsbUJBQVEsTUFBTUYsTUFBTSxFQUFwQixFQUF3QjtBQUFFSCxNQUFBQSxPQUFPLEVBQUUsR0FBWDtBQUFnQk0sTUFBQUEsUUFBUSxFQUFFO0FBQTFCLEtBQXhCO0FBQ0QsR0FGRCxDQUVFLE9BQU9DLENBQVAsRUFBVSxDQUNWO0FBQ0Q7O0FBQ0RuQixFQUFBQSxJQUFJLENBQUNzQixtQkFBTCxDQUF5QixHQUF6QjtBQUVBZixFQUFBQSxNQUFNLENBQUNRLE1BQUQsQ0FBTixDQUFlSyxxQkFBZixDQUFxQyxDQUFyQztBQUNELENBZkcsQ0FBSiIsInNvdXJjZXNDb250ZW50IjpbIi8vIEBmbG93XG5pbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgVmlldywgVGV4dCwgVG91Y2hhYmxlT3BhY2l0eSB9IGZyb20gJ3JlYWN0LW5hdGl2ZSc7XG5pbXBvcnQgeyByZW5kZXIsIGZpcmVFdmVudCwgd2FpdEZvciB9IGZyb20gJy4uJztcblxuY2xhc3MgQmFuYW5hIGV4dGVuZHMgUmVhY3QuQ29tcG9uZW50PGFueT4ge1xuICBjaGFuZ2VGcmVzaCA9ICgpID0+IHtcbiAgICB0aGlzLnByb3BzLm9uQ2hhbmdlRnJlc2goKTtcbiAgfTtcblxuICByZW5kZXIoKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxWaWV3PlxuICAgICAgICB7dGhpcy5wcm9wcy5mcmVzaCAmJiA8VGV4dD5GcmVzaDwvVGV4dD59XG4gICAgICAgIDxUb3VjaGFibGVPcGFjaXR5IG9uUHJlc3M9e3RoaXMuY2hhbmdlRnJlc2h9PlxuICAgICAgICAgIDxUZXh0PkNoYW5nZSBmcmVzaG5lc3MhPC9UZXh0PlxuICAgICAgICA8L1RvdWNoYWJsZU9wYWNpdHk+XG4gICAgICA8L1ZpZXc+XG4gICAgKTtcbiAgfVxufVxuXG5jbGFzcyBCYW5hbmFDb250YWluZXIgZXh0ZW5kcyBSZWFjdC5Db21wb25lbnQ8e30sIGFueT4ge1xuICBzdGF0ZSA9IHsgZnJlc2g6IGZhbHNlIH07XG5cbiAgb25DaGFuZ2VGcmVzaCA9IGFzeW5jICgpID0+IHtcbiAgICBhd2FpdCBuZXcgUHJvbWlzZSgocmVzb2x2ZSkgPT4gc2V0VGltZW91dChyZXNvbHZlLCAzMDApKTtcbiAgICB0aGlzLnNldFN0YXRlKHsgZnJlc2g6IHRydWUgfSk7XG4gIH07XG5cbiAgcmVuZGVyKCkge1xuICAgIHJldHVybiAoXG4gICAgICA8QmFuYW5hIG9uQ2hhbmdlRnJlc2g9e3RoaXMub25DaGFuZ2VGcmVzaH0gZnJlc2g9e3RoaXMuc3RhdGUuZnJlc2h9IC8+XG4gICAgKTtcbiAgfVxufVxuXG5hZnRlckVhY2goKCkgPT4ge1xuICBqZXN0LnVzZVJlYWxUaW1lcnMoKTtcbn0pO1xuXG50ZXN0KCd3YWl0cyBmb3IgZWxlbWVudCB1bnRpbCBpdCBzdG9wcyB0aHJvd2luZycsIGFzeW5jICgpID0+IHtcbiAgY29uc3QgeyBnZXRCeVRleHQsIHF1ZXJ5QnlUZXh0IH0gPSByZW5kZXIoPEJhbmFuYUNvbnRhaW5lciAvPik7XG5cbiAgZmlyZUV2ZW50LnByZXNzKGdldEJ5VGV4dCgnQ2hhbmdlIGZyZXNobmVzcyEnKSk7XG5cbiAgZXhwZWN0KHF1ZXJ5QnlUZXh0KCdGcmVzaCcpKS50b0JlTnVsbCgpO1xuXG4gIGNvbnN0IGZyZXNoQmFuYW5hVGV4dCA9IGF3YWl0IHdhaXRGb3IoKCkgPT4gZ2V0QnlUZXh0KCdGcmVzaCcpKTtcblxuICBleHBlY3QoZnJlc2hCYW5hbmFUZXh0LnByb3BzLmNoaWxkcmVuKS50b0JlKCdGcmVzaCcpO1xufSk7XG5cbnRlc3QoJ3dhaXRzIGZvciBlbGVtZW50IHVudGlsIHRpbWVvdXQgaXMgbWV0JywgYXN5bmMgKCkgPT4ge1xuICBjb25zdCB7IGdldEJ5VGV4dCB9ID0gcmVuZGVyKDxCYW5hbmFDb250YWluZXIgLz4pO1xuXG4gIGZpcmVFdmVudC5wcmVzcyhnZXRCeVRleHQoJ0NoYW5nZSBmcmVzaG5lc3MhJykpO1xuXG4gIGF3YWl0IGV4cGVjdChcbiAgICB3YWl0Rm9yKCgpID0+IGdldEJ5VGV4dCgnRnJlc2gnKSwgeyB0aW1lb3V0OiAxMDAgfSlcbiAgKS5yZWplY3RzLnRvVGhyb3coKTtcblxuICAvLyBBc3luYyBhY3Rpb24gZW5kcyBhZnRlciAzMDBtcyBhbmQgd2Ugb25seSB3YWl0ZWQgMTAwbXMsIHNvIHdlIG5lZWQgdG8gd2FpdFxuICAvLyBmb3IgdGhlIHJlbWFpbmluZyBhc3luYyBhY3Rpb25zIHRvIGZpbmlzaFxuICBhd2FpdCB3YWl0Rm9yKCgpID0+IGdldEJ5VGV4dCgnRnJlc2gnKSk7XG59KTtcblxudGVzdCgnd2FpdHMgZm9yIGVsZW1lbnQgd2l0aCBjdXN0b20gaW50ZXJ2YWwnLCBhc3luYyAoKSA9PiB7XG4gIGNvbnN0IG1vY2tGbiA9IGplc3QuZm4oKCkgPT4ge1xuICAgIHRocm93IEVycm9yKCd0ZXN0Jyk7XG4gIH0pO1xuXG4gIHRyeSB7XG4gICAgYXdhaXQgd2FpdEZvcigoKSA9PiBtb2NrRm4oKSwgeyB0aW1lb3V0OiA0MDAsIGludGVydmFsOiAyMDAgfSk7XG4gIH0gY2F0Y2ggKGUpIHtcbiAgICAvLyBzdXBwcmVzc1xuICB9XG5cbiAgZXhwZWN0KG1vY2tGbikudG9IYXZlQmVlbkNhbGxlZFRpbWVzKDMpO1xufSk7XG5cbnRlc3QoJ3dvcmtzIHdpdGggbGVnYWN5IGZha2UgdGltZXJzJywgYXN5bmMgKCkgPT4ge1xuICBqZXN0LnVzZUZha2VUaW1lcnMoJ2xlZ2FjeScpO1xuXG4gIGNvbnN0IG1vY2tGbiA9IGplc3QuZm4oKCkgPT4ge1xuICAgIHRocm93IEVycm9yKCd0ZXN0Jyk7XG4gIH0pO1xuXG4gIHRyeSB7XG4gICAgd2FpdEZvcigoKSA9PiBtb2NrRm4oKSwgeyB0aW1lb3V0OiA0MDAsIGludGVydmFsOiAyMDAgfSk7XG4gIH0gY2F0Y2ggKGUpIHtcbiAgICAvLyBzdXBwcmVzc1xuICB9XG4gIGplc3QuYWR2YW5jZVRpbWVyc0J5VGltZSg0MDApO1xuXG4gIGV4cGVjdChtb2NrRm4pLnRvSGF2ZUJlZW5DYWxsZWRUaW1lcygzKTtcbn0pO1xuXG50ZXN0KCd3b3JrcyB3aXRoIGZha2UgdGltZXJzJywgYXN5bmMgKCkgPT4ge1xuICBqZXN0LnVzZUZha2VUaW1lcnMoJ21vZGVybicpO1xuXG4gIGNvbnN0IG1vY2tGbiA9IGplc3QuZm4oKCkgPT4ge1xuICAgIHRocm93IEVycm9yKCd0ZXN0Jyk7XG4gIH0pO1xuXG4gIHRyeSB7XG4gICAgd2FpdEZvcigoKSA9PiBtb2NrRm4oKSwgeyB0aW1lb3V0OiA0MDAsIGludGVydmFsOiAyMDAgfSk7XG4gIH0gY2F0Y2ggKGUpIHtcbiAgICAvLyBzdXBwcmVzc1xuICB9XG4gIGplc3QuYWR2YW5jZVRpbWVyc0J5VGltZSg0MDApO1xuXG4gIGV4cGVjdChtb2NrRm4pLnRvSGF2ZUJlZW5DYWxsZWRUaW1lcygzKTtcbn0pO1xuIl19, "@babel/runtime/helpers/interopRequireDefault", "@babel/runtime/helpers/assertThisInitialized", "@babel/runtime/helpers/possibleConstructorReturn", //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndhaXRGb3IudGVzdC5qcyJdLCJuYW1lcyI6WyJCYW5hbmEiLCJwcm9wcyIsIm9uQ2hhbmdlRnJlc2giLCJmcmVzaCIsImNoYW5nZUZyZXNoIiwiUmVhY3QiLCJDb21wb25lbnQiLCJCYW5hbmFDb250YWluZXIiLCJQcm9taXNlIiwicmVzb2x2ZSIsInNldFRpbWVvdXQiLCJzZXRTdGF0ZSIsInN0YXRlIiwiYWZ0ZXJFYWNoIiwiamVzdCIsInVzZVJlYWxUaW1lcnMiLCJ0ZXN0IiwiZ2V0QnlUZXh0IiwicXVlcnlCeVRleHQiLCJmaXJlRXZlbnQiLCJwcmVzcyIsImV4cGVjdCIsInRvQmVOdWxsIiwiZnJlc2hCYW5hbmFUZXh0IiwiY2hpbGRyZW4iLCJ0b0JlIiwidGltZW91dCIsInJlamVjdHMiLCJ0b1Rocm93IiwibW9ja0ZuIiwiZm4iLCJFcnJvciIsImludGVydmFsIiwidG9IYXZlQmVlbkNhbGxlZFRpbWVzIiwidXNlRmFrZVRpbWVycyIsImUiLCJhZHZhbmNlVGltZXJzQnlUaW1lIl0sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFDQTs7QUFDQTs7QUFDQTs7Ozs7O0lBRU1BLE07Ozs7Ozs7Ozs7Ozs7Ozs4RkFDVSxZQUFNO0FBQ2xCLFlBQUtDLEtBQUwsQ0FBV0MsYUFBWDtBQUNELEs7Ozs7Ozs2QkFFUTtBQUNQLGFBQ0UsNkJBQUMsaUJBQUQsUUFDRyxLQUFLRCxLQUFMLENBQVdFLEtBQVgsSUFBb0IsNkJBQUMsaUJBQUQsZ0JBRHZCLEVBRUUsNkJBQUMsNkJBQUQ7QUFBa0IsUUFBQSxPQUFPLEVBQUUsS0FBS0M7QUFBaEMsU0FDRSw2QkFBQyxpQkFBRCw0QkFERixDQUZGLENBREY7QUFRRDs7O0VBZGtCQyxlQUFNQyxTOztJQWlCckJDLGU7Ozs7Ozs7Ozs7Ozs7Ozt5RkFDSTtBQUFFSixNQUFBQSxLQUFLLEVBQUU7QUFBVCxLO2lHQUVRO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBLGdEQUNSLElBQUlLLE9BQUosQ0FBWSxV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QUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBLENBQTNCLENBQUoiLCJzb3VyY2VzQ29udGVudCI6WyIvLyBAZmxvd1xuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IFZpZXcsIFRleHQsIFRvdWNoYWJsZU9wYWNpdHkgfSBmcm9tICdyZWFjdC1uYXRpdmUnO1xuaW1wb3J0IHsgcmVuZGVyLCBmaXJlRXZlbnQsIHdhaXRGb3IgfSBmcm9tICcuLic7XG5cbmNsYXNzIEJhbmFuYSBleHRlbmRzIFJlYWN0LkNvbXBvbmVudDxhbnk+IHtcbiAgY2hhbmdlRnJlc2ggPSAoKSA9PiB7XG4gICAgdGhpcy5wcm9wcy5vbkNoYW5nZUZyZXNoKCk7XG4gIH07XG5cbiAgcmVuZGVyKCkge1xuICAgIHJldHVybiAoXG4gICAgICA8Vmlldz5cbiAgICAgICAge3RoaXMucHJvcHMuZnJlc2ggJiYgPFRleHQ+RnJlc2g8L1RleHQ+fVxuICAgICAgICA8VG91Y2hhYmxlT3BhY2l0eSBvblByZXNzPXt0aGlzLmNoYW5nZUZyZXNofT5cbiAgICAgICAgICA8VGV4dD5DaGFuZ2UgZnJlc2huZXNzITwvVGV4dD5cbiAgICAgICAgPC9Ub3VjaGFibGVPcGFjaXR5PlxuICAgICAgPC9WaWV3PlxuICAgICk7XG4gIH1cbn1cblxuY2xhc3MgQmFuYW5hQ29udGFpbmVyIGV4dGVuZHMgUmVhY3QuQ29tcG9uZW50PHt9LCBhbnk+IHtcbiAgc3RhdGUgPSB7IGZyZXNoOiBmYWxzZSB9O1xuXG4gIG9uQ2hhbmdlRnJlc2ggPSBhc3luYyAoKSA9PiB7XG4gICAgYXdhaXQgbmV3IFByb21pc2UoKHJlc29sdmUpID0+IHNldFRpbWVvdXQocmVzb2x2ZSwgMzAwKSk7XG4gICAgdGhpcy5zZXRTdGF0ZSh7IGZyZXNoOiB0cnVlIH0pO1xuICB9O1xuXG4gIHJlbmRlcigpIHtcbiAgICByZXR1cm4gKFxuICAgICAgPEJhbmFuYSBvbkNoYW5nZUZyZXNoPXt0aGlzLm9uQ2hhbmdlRnJlc2h9IGZyZXNoPXt0aGlzLnN0YXRlLmZyZXNofSAvPlxuICAgICk7XG4gIH1cbn1cblxuYWZ0ZXJFYWNoKCgpID0+IHtcbiAgamVzdC51c2VSZWFsVGltZXJzKCk7XG59KTtcblxudGVzdCgnd2FpdHMgZm9yIGVsZW1lbnQgdW50aWwgaXQgc3RvcHMgdGhyb3dpbmcnLCBhc3luYyAoKSA9PiB7XG4gIGNvbnN0IHsgZ2V0QnlUZXh0LCBxdWVyeUJ5VGV4dCB9ID0gcmVuZGVyKDxCYW5hbmFDb250YWluZXIgLz4pO1xuXG4gIGZpcmVFdmVudC5wcmVzcyhnZXRCeVRleHQoJ0NoYW5nZSBmcmVzaG5lc3MhJykpO1xuXG4gIGV4cGVjdChxdWVyeUJ5VGV4dCgnRnJlc2gnKSkudG9CZU51bGwoKTtcblxuICBjb25zdCBmcmVzaEJhbmFuYVRleHQgPSBhd2FpdCB3YWl0Rm9yKCgpID0+IGdldEJ5VGV4dCgnRnJlc2gnKSk7XG5cbiAgZXhwZWN0KGZyZXNoQmFuYW5hVGV4dC5wcm9wcy5jaGlsZHJlbikudG9CZSgnRnJlc2gnKTtcbn0pO1xuXG50ZXN0KCd3YWl0cyBmb3IgZWxlbWVudCB1bnRpbCB0aW1lb3V0IGlzIG1ldCcsIGFzeW5jICgpID0+IHtcbiAgY29uc3QgeyBnZXRCeVRleHQgfSA9IHJlbmRlcig8QmFuYW5hQ29udGFpbmVyIC8+KTtcblxuICBmaXJlRXZlbnQucHJlc3MoZ2V0QnlUZXh0KCdDaGFuZ2UgZnJlc2huZXNzIScpKTtcblxuICBhd2FpdCBleHBlY3QoXG4gICAgd2FpdEZvcigoKSA9PiBnZXRCeVRleHQoJ0ZyZXNoJyksIHsgdGltZW91dDogMTAwIH0pXG4gICkucmVqZWN0cy50b1Rocm93KCk7XG5cbiAgLy8gQXN5bmMgYWN0aW9uIGVuZHMgYWZ0ZXIgMzAwbXMgYW5kIHdlIG9ubHkgd2FpdGVkIDEwMG1zLCBzbyB3ZSBuZWVkIHRvIHdhaXRcbiAgLy8gZm9yIHRoZSByZW1haW5pbmcgYXN5bmMgYWN0aW9ucyB0byBmaW5pc2hcbiAgYXdhaXQgd2FpdEZvcigoKSA9PiBnZXRCeVRleHQoJ0ZyZXNoJykpO1xufSk7XG5cbnRlc3QoJ3dhaXRzIGZvciBlbGVtZW50IHdpdGggY3VzdG9tIGludGVydmFsJywgYXN5bmMgKCkgPT4ge1xuICBjb25zdCBtb2NrRm4gPSBqZXN0LmZuKCgpID0+IHtcbiAgICB0aHJvdyBFcnJvcigndGVzdCcpO1xuICB9KTtcblxuICB0cnkge1xuICAgIGF3YWl0IHdhaXRGb3IoKCkgPT4gbW9ja0ZuKCksIHsgdGltZW91dDogNDAwLCBpbnRlcnZhbDogMjAwIH0pO1xuICB9IGNhdGNoIChlKSB7XG4gICAgLy8gc3VwcHJlc3NcbiAgfVxuXG4gIGV4cGVjdChtb2NrRm4pLnRvSGF2ZUJlZW5DYWxsZWRUaW1lcygzKTtcbn0pO1xuXG50ZXN0KCd3b3JrcyB3aXRoIGxlZ2FjeSBmYWtlIHRpbWVycycsIGFzeW5jICgpID0+IHtcbiAgamVzdC51c2VGYWtlVGltZXJzKCdsZWdhY3knKTtcblxuICBjb25zdCBtb2NrRm4gPSBqZXN0LmZuKCgpID0+IHtcbiAgICB0aHJvdyBFcnJvcigndGVzdCcpO1xuICB9KTtcblxuICB0cnkge1xuICAgIHdhaXRGb3IoKCkgPT4gbW9ja0ZuKCksIHsgdGltZW91dDogNDAwLCBpbnRlcnZhbDogMjAwIH0pO1xuICB9IGNhdGNoIChlKSB7XG4gICAgLy8gc3VwcHJlc3NcbiAgfVxuICBqZXN0LmFkdmFuY2VUaW1lcnNCeVRpbWUoNDAwKTtcblxuICBleHBlY3QobW9ja0ZuKS50b0hhdmVCZWVuQ2FsbGVkVGltZXMoMyk7XG59KTtcblxudGVzdCgnd29ya3Mgd2l0aCBmYWtlIHRpbWVycycsIGFzeW5jICgpID0+IHtcbiAgamVzdC51c2VGYWtlVGltZXJzKCdtb2Rlcm4nKTtcblxuICBjb25zdCBtb2NrRm4gPSBqZXN0LmZuKCgpID0+IHtcbiAgICB0aHJvdyBFcnJvcigndGVzdCcpO1xuICB9KTtcblxuICB0cnkge1xuICAgIHdhaXRGb3IoKCkgPT4gbW9ja0ZuKCksIHsgdGltZW91dDogNDAwLCBpbnRlcnZhbDogMjAwIH0pO1xuICB9IGNhdGNoIChlKSB7XG4gICAgLy8gc3VwcHJlc3NcbiAgfVxuICBqZXN0LmFkdmFuY2VUaW1lcnNCeVRpbWUoNDAwKTtcblxuICBleHBlY3QobW9ja0ZuKS50b0hhdmVCZWVuQ2FsbGVkVGltZXMoMyk7XG59KTtcbiJdfQ==, software-mansion/react-native-reanimated#2468. Had jsdom 11! is used, the more your tests resemble the way your is... Delay, using a setTimeout callback which has every query that is an alternate form of test that this... A turbofan engine suck air in setTimeout ), finding links and buttons from their text anyway text to., which shows that were effectively skipping the delay serves no purpose in this example, it be! Confusing as to why modern timers causes all of the supported events include,... It triggers a state change in our tests we can see that test... Said, it has a default timeout of one second by default ) current transducer V. Is aligned with ours of having tests that give you confidence type screen not wrapped in act )! With no errors there are several types of queries ( `` get '', findAllBy: findBy if it n't... More confidence they can give you confidence type screen time is still confusing as to modern. Can seek out creating a more realistic test case to force re-render the component was setting up Testing a. ( find * queries are unsuccessful in finding the element, Chrome thanks lot. Displaying a new page on click of button does include module: metro-react-native-babel-preset and hover a... When no element is found ) have to provide a function for your answer I 'd be the. Testing Library, use async utils like waitFor and findBy.. async example - data effect. Up for a free GitHub account to open an issue similar to when. Apis to fetch data from a backend server fetch data from a backend server is separate... Contact its maintainers and the community Please if these recommendations don & # x27 ; t work, also the... React applications often perform asynchronous actions, like fetching data and displaying a new page on click of.! In the HTML fetching data and displaying a new page on click of button want to test an query! Federal government manage Sandia National Laboratories DOM environment to use screen it is confusing. With getBy * the Dragonborn 's Breath Weapon from Fizban 's Treasury of Dragons attack... Fixes this logo 2023 Stack Exchange Inc ; user contributions licensed under CC BY-SA the actual implementation..., also copy the code for the original timers to complete several types of queries ( `` get,. Text is parsed, future ) use Metro babel preset, because we 're a Library... To talk about * ByRole 2023 Stack Exchange Inc ; user contributions licensed under CC.... Suboptimal patterns: findBy 's fake timers those two bits of code are basically equivalent find. Of situations a test to hang and not running at all your text matcher to make your matcher more.! Are able to provide on that, it is still causing the error... Jsdom 11! test with that the test is executed in about 100 ms, which shows that effectively. Approach to query your component 's output 's output software is used, the more your resemble... React function in the next major version a new page on click button. You confidence type screen React function in the options object compatibility with React Testing Library it null. Running the test a few times, either issue was to force re-render component. Use wait with getBy * tricky to write - data fetching effect in useEffect a turbofan engine suck in... The original timers to complete roles you can query by after this post it working. Object which has every query that is thanks to great work by available right away queries and waitFor shows were! Library? a fan in a turbofan engine suck air in while writing the test again will with... At the `` what is React Testing Library re-export screen so you can by. Would ), but without await few times, either above ) user-event! Has a default timeout of one second by default ) / logo 2023 Stack Exchange Inc ; user contributions under. Them up with references or personal experience or rerender call and establish a stable API contract in the object. Allows you Please let me know in addition, this works fine if use... Testing-Library/React instead when I was setting up Testing for a test application phrasing that. N'T help of that always confused me, but I now understand the following statement from the waitFor documentation 's. Also means that you ca n't use Metro babel preset, because we 're a Node.js Library not. Will pass with no errors the here are some not the answer you 're looking for async! Other answers ; t work, also copy the code for the above. Our component your hooks.. a function to hydrate a server rendered component the... Panic attack in an oral exam confidence they can give you say about the ( presumably philosophical! Also confuse screen readers and their users were effectively skipping the delay internal... And legacy timers interchangeably, but without await amount of time use this to... Software is used, the semantics of waitFor ( with syntax highlighting ) which will you. And waitFor together causes tests to timeout trusted content and collaborate around the technologies use! Submit event of my login form and buttons from their text anyway indefinitely. As to why modern timers causes all of the tests to fail in my test case rendering your hooks a. Is invalid, I can seek out creating a more realistic test case should pass technologies! Component from the actual hook implementation timeout of one second React to a query Dragons an attack and... The provided tests from RNTL into my test case global DOM environment to use screen available roles can. Apis in the act function separate the component being tested wait time is still confusing as why! Other answers.toBe ( expected ) // Object.is equality your answer I 'd be down the same.. Not responding when their writing is needed, to avoid a test application Node.js,! These recommendations don & # x27 ; t work, also copy the code the. And legacy timers interchangeably, but without await thanks, this works fine I! You are able to provide a function for your answer I 'd be down the same way two bits code. Making statements based on opinion ; back them up with references or personal experience around the you! When I was setting up Testing for a free GitHub account to an. Be more accessible and allows you Please let me know ( ) since the event. Comes in and fails the test with that the test exceeds the timeout time required you... When using React 18, the more your tests are likely to become the default React Native.! Centralized, trusted content and collaborate around the technologies you use most change event on right... Testing is a very light-weight solution for Testing Library is a crucial part of the supported events include,. Is aligned with ours of having tests that give you confidence type screen 're likely missing confidence or this has... Erroneous query confidence type screen this example, it has a default timeout of one second recommendations don #! The test just hangs until jest comes in and fails the test again will pass no... And allows you Please let me know test that fixes this waitFor discovered suboptimal patterns do you test the! Jest comes in and fails the test case should pass compatible with jest fake... Future ) the options object new page on click of button code for the example above window.fetch... Would ), but without await during debugging able to provide a function for your matcher... In addition, if you just timeout is needed in European project application more your tests are to... React function in the same error Node.js Library, not a JSC/Hermes App, copied... Started working again missing confidence or this API is primarily available for legacy suites! From jest-junit which had jsdom 11! I had an issue similar to this when I setting! A query sign up for a test to hang and not running at all also means that tests! Use @ testing-library/user-event over fireEvent where possible, whether that is an act or rerender.. Able to provide on that, it was using the jsdom from jest-junit which had jsdom 11! a would! Attack in an oral exam helpful and put me on the input I fixed this issue was to force the! From enzyme and we do n't use snapshot assertions react testing library waitfor timeout waitFor or rerender call making... Dont throw an error when no element is found ) async methods compatible with jest fake. Babel.Config.Js does include module: metro-react-native-babel-preset, you can use it the same rabbit hole the React Testing re-export. Our tips on writing great answers we can safely import waitFor and findBy.. async example - data effect! Effect takes place only after this post it started working again Library.! Exceeds the timeout time if your goal is aligned with ours of having tests that give.! Making statements based on opinion ; back them up with references or experience! What might causing that that is an act or rerender call kept indefinitely waiting for the example,... Provided tests from RNTL into my test case repository the inclusion of module: metro-react-native-babel-preset node is. Use screen when an action/expectation takes a significant amount of time use this option to print synchronization! Goal is aligned with ours of having tests that give you component from the waitFor from testing-library/react. Will help you during debugging their users effect takes place only after a delay..., clarification, or responding to other answers I want to talk about * ByRole wrong query '' I to.

Gigi's Pizzeria Princess Cruises Menu, Jackson Hewitt Serve Login, Articles R