testing-library / dom-testing-library

🐙 Simple and complete DOM testing utilities that encourage good testing practices.
https://testing-library.com/dom
MIT License
3.26k stars 466 forks source link

fix: mock brower event about issues 1327 #1328

Open electroluxcode opened 1 month ago

electroluxcode commented 1 month ago

fix https://github.com/testing-library/dom-testing-library/issues/1327

this pr is about mock brower event, it is a possible solutions to the https://github.com/testing-library/dom-testing-library/issues/1327) issues

What: This PR adds two new lifecycle methods, before and cond, developers only need to control these two lifecycles to simulate most browser behaviors.. on top of the existing ones to simulate browser events. This is just a draft; please do not merge.

Why:

The events in dom-testing-library are encapsulated based on the native Event class. However, when there are conflicts between this Event and native DOM events, it may not fully replicate the behavior.

How:

Checklist:

before this pr, it will trigger dragstar and dragover event ,it is error because dragstart is prevent,it should only trigger dragstart event after this pr ,when i test this case ,it 'll be as expect


test('assigns dataTransfer properties', () => {
  const node = document.createElement('div')
  node.addEventListener('dragstart', (e)=>{
    e.preventDefault()
  })
  node.addEventListener('dragover', (e)=>{
    console.log("dragOver:-------------")
  })
  fireEvent.dragStart(node, {dataTransfer: {dropEffect: 'move'}})
  fireEvent.dragOver(node, {dataTransfer: {dropEffect: 'move'}})
})
codesandbox-ci[bot] commented 1 month ago

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 5cda1a3c7d57ae624ccd46edc44e992342179353:

Sandbox Source
react-testing-library-examples Configuration