kobotoolbox / kpi / 14498282071

81%

master: 76%

push

github

test(storybook): languageSelector search DEV-99 (#5670)

### 📣 Summary
Add Storybook test to verify that searching LanguageSelector works
correctly.

### 💭 Notes

Changes here:
- Installed `msw` and `msw-storybook-addon` for mocking API calls
- This piece of code requires a directory with `mockServiceWorker.js` to
be present, so I created "msw-mocks" directory (not sure about the name,
official documentation suggest using "public", but it's a very vague
name)
- To make mocking calls possible, I created files for mocks of two
stores:
  - `languagesListStore.mock.ts` that has big JSON responses
  - `envStore.mock.ts` that has one smaller JSON response
- Added single test to `LanguageSelector.stories.tsx` 
- Configuring the component required me to mock few different calls, see
`parameters.msw.handlers`
- `TestSearchSwedish` uses searchbox of `LanguageSelector` to search for
"swed" and to find "Swedis (sv)"
- I've added `sleep` function as suggested in Storybook documentation
(am considering moving this somewhere, maybe `.storybook/utils.ts`?) and
I don't particullary like it, but I couldn't find some better way to
await some acions/calls to be finished. I guess it mimics how user acts
in the UI better :shrug:
- There is also waitFor, but I found that the code looks less clear, and
the result is similar (`waitFor` is better in that it checks every 10ms
until final timeout):
       ```ts
       await waitFor(
         async () => {
           const noSearchItem = await canvas.findByText(/^Arabic/)
           await expect(noSearchItem).toBeInTheDocument()
         },
         { timeout: 2000 },
       )
       // VS
       await sleep(2000)
       const noSearchItem = await canvas.findByText(/^Arabic/)
       await expect(noSearchItem).toBeInTheDocument()
       ```
- Removed some obsolete properties from `EnvironmentResponse` interface 
- Fixed bug in `LanguageSelector`: when clearing the searchbox, initial
list of results was not refetched :bug: :hammer:... (continued)

6135 of 9743 branches covered (62.97%)

23460 of 28971 relevant lines covered (80.98%)

1.6 hits per line