matrix-org / matrix-org/matrix-viewer

Use `@testing-library/dom` to find elements in tests

Open
#161 0 comments 0 reactions 0 assignees View on GitHub
A-testing T-Task
Dominant language
JavaScript
Stars
84
Forks
10
PR merge metrics
No merged PRs in 30d

Description

We do some `dom.document.querySelector` stuff in our end-to-end tests but they give bad errors when they fail to find the Element in question.

It would be nice to use the standard popular [`@testing-library/dom`](https://github.com/testing-library/dom-testing-library) library that handles some of this complexity for us.

One hurdle to overcome is how to use the library without a globally accessible DOM that it expects. There is some discussion in https://github.com/testing-library/dom-testing-library/issues/100 about maybe how to accomplish this. We use [`linkedom`](https://github.com/WebReflection/linkedom) for our lightweight DOM implementation and while we could make a it a global with some more `child_process` finagling like we do for the server-side rendering, that's pretty heavy for some better test assertions.

Or alternatively, just write some wrapper around finding Elements that outputs the DOM to better debug.

Contributor guide

Open the contributing guide

Research direction

Start by locating the end-to-end tests that use dom.document.querySelector and read how linkedom is initialized, including the child_process setup used for server-side rendering. Decide whether @testing-library/dom can use that DOM or whether a wrapper is needed; done means failed element lookups provide better diagnostics and the end-to-end tests still pass.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
testing-qa
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.