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

chore: add testing-library/dom dependency #27493

Merged
merged 4 commits into from
Oct 18, 2024

Conversation

cryptotavares
Copy link
Contributor

@cryptotavares cryptotavares commented Sep 30, 2024

Description

We are adding testing-library/dom as direct dependency in order to start leveraging the testing library testing playground. (As a note, latest versions of testing-library/react have testing-library/dom as a peer dep instead of a dependency. Though we are not updating testing-library/react to the latest version as it requires React 18 and we are still in React 16).

Using the screen from the dom library we can now use screen.logTestingPlaygroundURL() (with or without a specific section passed into it) and when running the test it will log an url in the console for that specific component in the testing playground. We can use that to validate what is getting rendered and what is the suggested query to infer and write expectations on certain elements/text/values.

Example of a logged url:
https://testing-playground.com/#markup=DwEwlgbgBAxgNgQwM5ILwCIC2mC0AjAewA9YCA7AMzACdcxKCdqCB3KbfYnHTBagc3o4ALgQAOOAEztchIt14ChhYaNzSOc7mIQhwZfkzD8AFsKkzO8nDr31DcAKYVzG2VxzgkYxAE8cFE4kmh6BjvLg1I4wwmDkTKyWWgFBOCzUCBLpmUkeAFYArkixFP4w5MKOZObeCDCO+I7CLI5VudblcATUIuHmIM4IBXDC7dzMBWQDIDhw-OhQxb5OGAQQjtSBrGkZYgBcUAhkviwmG44A3OxCZ8ZmB5IALGJEV2IESGCx5AdRiLHrC7oAB8oEgsEQKAwIWC7msXh8CH8YVhVm4KM8NGi3zICTYMO4hWKYFKOHK1Sq5nqFOoYxwCDgxlxX0cmCQKXCOGKfGEILB0HgyDQWDhdIRfg5qOSDKZOBZbLJlI2fLEEKF0NFHEqRFGWr63EIIH8mBmmEc4AKmDpnW6crIZ2oXxBAFFibxKiBYCYjvxHEhgAB6MSg8AQEPgwVQ9ALYQIPD0AZEDAABgWSxW6HFSIOKKBUBACFjIgIBBGYDEYnNGAWfDACE8fpgjrw5rwvgwsQr-lEpc7OAAjKn84X691jPQGSIvhnXbF3eavT6-YcolBToXrqZRt6K20SVBfAQClB+AQoMITBNTGuviZzyYwEhzxkyEg6jiAHRQAAqD6fj6gIlRgQKAxCicAYjiMgABooDIAhgJPAo+COSpHA-PlajINUoxhSwwHJfDyW4T4AC8GiQK0CR4PhBFxJwXAHMVH0Rfx6EZMgGjwLoYAAa2tUtbQI+JMAKD002EZZHGhZBeLlXhfQOApqDgAAKAByD8AzABS-W08kkADABHAo-U-JAIH4dSAEogVBAMsPs0MnMgFyw0DZz+Rw4U8OorNkSCOl+EyCxqIxbIsl2OkZX4ZlKgValKlpajMCEFgwBAC8cFTUFVUjHzNVwbVdSK-VOCNHhPWom0enoB0nUWSSM1OFkuR0eoDjAhoIrsgBNI91NXQQIHsRYCDNchHCgRw4CQKbK1oR9PnIc8z28KpPQvACEEwI9qigChmCtQ9lMOGBykmYQP0DYMPNcu73NDbyNSsUhKBoOgGDxOlFDo4sJDcNEaKUXEVDUUK4W0XR9EMR0twhoHbBh2ZnFcZjvAlFE6QxSJsSg76wtSCKdhyaigJJMoKkpNq6i4poWjaarBJ6YqGwoIYRjpCYpnNWZ5kaqTVnWTYuhYEn9kOY5TnOK5UtxW4tweZ5XlAj4vig34ZsLSBLj5J78peuR0dYyVsdSXHIPiZh8UhnBydJclKmqRUaWixlYrleL2QxblqF5cMBUhArXr8ljMcC6iYri1l2US5VcuekUQ9KnVLFZ8rjVNc0wEtASulq+0NidYEAGVKymUaYEyG63NrryDaTuQJMFrBaKEBjhAOIZRFlhB5HSzKTAOQdkwAUjs+ug8N4hjfD8I3dleVY6Vag9YjKfG5nlK2+ZMgOIaDamNDjGkTtfefrSjKspy4A8o33yU5K3odQNAgKpNNOytZqOXaSukkfsGfegDRAbSndtHBKK8862lZgMdmwwn7JDwHUXi-BuYzBqvgFBaC9ozAZElMg2t1hc1wbzIgcAFgFiLJUYkIAMCfFEv8fGoheJVBwBABkpkQT9hrg9AOAdE6ELNHBHajgAD6YjUooHsJhHQ2EG54SEeIsRwlsIcFUUReIXIwDkUqrPU+7FgH4B4vxJm+c7T1V5ALDMvAkByR0ggRSUBlJqU0tpXShlVGGRMmZKCH4LJWVsnyByciE4KMKs-UYSiJEcLgKZT+L8M56LMTA-UcCOb+2TEQZMAB2AAbP2R4H5ikAGZdB5IABy8IDJ5Gp906nuQabXIAA

Open in GitHub Codespaces

Related issues

Fixes: None

Pre-merge author checklist

Pre-merge reviewer checklist

  • I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
  • I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

@cryptotavares cryptotavares requested a review from a team as a code owner September 30, 2024 13:34
Copy link
Contributor

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

@github-actions github-actions bot added the team-confirmations Push issues to confirmations team label Sep 30, 2024
Copy link

socket-security bot commented Sep 30, 2024

New and removed dependencies detected. Learn more about Socket for GitHub ↗︎

Package New capabilities Transitives Size Publisher
npm/@testing-library/dom@7.31.2 environment +4 3.17 MB testing-library-bot
npm/dom-accessibility-api@0.5.16 None 0 257 kB eps1lon
npm/lz-string@1.5.0 None 0 176 kB pieroxy

🚮 Removed packages: npm/@testing-library/dom@7.22.2, npm/dom-accessibility-api@0.5.0

View full report↗︎

@metamaskbot metamaskbot added the INVALID-PR-TEMPLATE PR's body doesn't match template label Sep 30, 2024
Copy link

sonarcloud bot commented Sep 30, 2024

@cryptotavares cryptotavares force-pushed the cryptotavares/add-testing-library-dom branch from 9d6509c to c119474 Compare October 1, 2024 17:12
@metamaskbot
Copy link
Collaborator

Builds ready [c119474]
Page Load Metrics (1886 ± 118 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint157525681886247119
domContentLoaded155825131857243117
load157125661886246118
domInteractive227751189
Bundle size diffs
  • background: 0 Bytes (0.00%)
  • ui: 0 Bytes (0.00%)
  • common: 0 Bytes (0.00%)

@cryptotavares cryptotavares force-pushed the cryptotavares/add-testing-library-dom branch from c119474 to 05364e2 Compare October 2, 2024 09:16
@metamaskbot
Copy link
Collaborator

Builds ready [05364e2]
Page Load Metrics (2064 ± 122 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint32027791896576277
domContentLoaded163227662026238114
load164028252064253122
domInteractive269447199
Bundle size diffs
  • background: 0 Bytes (0.00%)
  • ui: 0 Bytes (0.00%)
  • common: 0 Bytes (0.00%)

@cryptotavares cryptotavares requested a review from a team as a code owner October 2, 2024 10:14
@metamaskbot
Copy link
Collaborator

Builds ready [27a0e22]
Page Load Metrics (1801 ± 60 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint32019911710340163
domContentLoaded15411965176411656
load15491982180112660
domInteractive13236615225
Bundle size diffs
  • background: 0 Bytes (0.00%)
  • ui: 0 Bytes (0.00%)
  • common: 0 Bytes (0.00%)

@cryptotavares cryptotavares force-pushed the cryptotavares/add-testing-library-dom branch from 27a0e22 to f106df5 Compare October 3, 2024 14:53
@metamaskbot
Copy link
Collaborator

Builds ready [f106df5]
Page Load Metrics (2062 ± 163 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint168230962059341164
domContentLoaded163629782036327157
load168331032062340163
domInteractive26151523014
Bundle size diffs
  • background: 0 Bytes (0.00%)
  • ui: 0 Bytes (0.00%)
  • common: 0 Bytes (0.00%)

@cryptotavares cryptotavares force-pushed the cryptotavares/add-testing-library-dom branch from 7d20de8 to 407d5e5 Compare October 9, 2024 13:26
@cryptotavares cryptotavares force-pushed the cryptotavares/add-testing-library-dom branch from 407d5e5 to c9f69ba Compare October 17, 2024 11:29
@cryptotavares cryptotavares requested a review from a team as a code owner October 17, 2024 11:29
@cryptotavares cryptotavares requested a review from a team as a code owner October 17, 2024 14:30
@metamaskbot
Copy link
Collaborator

Builds ready [2341200]
Page Load Metrics (1834 ± 74 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint15672204183815675
domContentLoaded15342123179714670
load15662212183415474
domInteractive1591492512
backgroundConnect11100452612
firstReactRender47200883215
getState46222199
initialActions01000
loadScripts11201590132112862
setupStore1197272211
uiStartup17102462203018187
Bundle size diffs
  • background: 0 Bytes (0.00%)
  • ui: 0 Bytes (0.00%)
  • common: 0 Bytes (0.00%)

@cryptotavares cryptotavares force-pushed the cryptotavares/add-testing-library-dom branch from 2341200 to fb81083 Compare October 17, 2024 15:25
@metamaskbot
Copy link
Collaborator

Builds ready [fb81083]
Page Load Metrics (2152 ± 73 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint29723391812679326
domContentLoaded18702443212314570
load18832475215215373
domInteractive30193573517
backgroundConnect770282010
firstReactRender692981204924
getState564262412
initialActions01000
loadScripts13531960159013866
setupStore1366302010
uiStartup21052904241920096
Bundle size diffs
  • background: 0 Bytes (0.00%)
  • ui: 0 Bytes (0.00%)
  • common: 0 Bytes (0.00%)

@cryptotavares
Copy link
Contributor Author

For some reason the updates to the lock file from running the dedupe command, make the tests fail if there are obsolete snapshots. That's the reason I removed all obsolete snapshots on this PR

Copy link
Member

@andreahaku andreahaku left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@cryptotavares cryptotavares added this pull request to the merge queue Oct 18, 2024
Merged via the queue into develop with commit ce8eeb1 Oct 18, 2024
76 checks passed
@cryptotavares cryptotavares deleted the cryptotavares/add-testing-library-dom branch October 18, 2024 10:54
@github-actions github-actions bot locked and limited conversation to collaborators Oct 18, 2024
@metamaskbot metamaskbot added the release-12.8.0 Issue or pull request that will be included in release 12.8.0 label Oct 18, 2024
@gauthierpetetin gauthierpetetin added release-12.6.0 Issue or pull request that will be included in release 12.6.0 and removed release-12.8.0 Issue or pull request that will be included in release 12.8.0 labels Oct 21, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
INVALID-PR-TEMPLATE PR's body doesn't match template release-12.6.0 Issue or pull request that will be included in release 12.6.0 team-confirmations Push issues to confirmations team
Projects
Archived in project
Development

Successfully merging this pull request may close these issues.

7 participants