Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(ByRole): Ensure valid query selectors in all transpilation targets #1055

Merged
merged 1 commit into from
Oct 14, 2021

Conversation

eps1lon
Copy link
Member

@eps1lon eps1lon commented Oct 14, 2021

What:

Fixes erros like "'*[role~="textbox"],[object Set]' is not a valid selector" when using module entrypoints.

Why:

I only reviewed the transpiled node code in #1046 which didn't transpile ... away. The module entrypoint does though.

Example failure: https://app.circleci.com/pipelines/github/mui-org/material-ui/53629/workflows/6c71e957-ee1c-4e20-8ea4-cd856f7e27d8/jobs/305270

Bad transpilation:
return [explicitRoleSelector].concat(implicitRoleSelectors != null ? implicitRoleSelectors : []).join(',');
-- https://unpkg.com/@testing-library/dom@8.9.0/dist/@testing-library/dom.esm.js

This is equiavalent to ['[role="button"]'].concat(new Set(['button'])) which evaluates to ['[role="button"]', new Set(['button'])] instead of the intended ['[role="button"]', 'button']

The module entrypoint targets old browsers without support for spread syntax. We assume that every ... target is an array which means ... can be transpiled using Array.prototype.concat. However, this breaks for any other iterable (here: Set). In other words, we're transpiling with @babel/plugin-transform-spread enabling loose mode (https://babeljs.io/docs/en/babel-plugin-transform-spread#loose).

How:

Directly use concat and leave a comment about using ...

Checklist:

  • [ ] Documentation added to the
    docs site
  • Tests (built this PRs module entrypoint, pasted into local fork of mui-org/material-ui and run successfully yarn test:karma which was failing without this change)
  • [ ] TypeScript definitions updated
  • Ready to be merged

@codesandbox-ci
Copy link

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit bc9e015:

Sandbox Source
react-testing-library-examples Configuration

@codecov
Copy link

codecov bot commented Oct 14, 2021

Codecov Report

Merging #1055 (5f464b3) into main (8edfad0) will not change coverage.
The diff coverage is 100.00%.

Impacted file tree graph

@@            Coverage Diff            @@
##              main     #1055   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           25        25           
  Lines          927       928    +1     
  Branches       288       287    -1     
=========================================
+ Hits           927       928    +1     
Flag Coverage Δ
node-12 100.00% <100.00%> (ø)
node-14 100.00% <100.00%> (ø)
node-16.9.1 100.00% <100.00%> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files Coverage Δ
src/queries/role.js 100.00% <100.00%> (ø)

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 8edfad0...5f464b3. Read the comment docs.

@eps1lon eps1lon marked this pull request as ready for review October 14, 2021 08:50
@github-actions
Copy link

🎉 This PR is included in version 8.9.1 🎉

The release is available on:

Your semantic-release bot 📦🚀

MatthiasKainer pushed a commit to MatthiasKainer/dom-testing-library that referenced this pull request Nov 16, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants