-
-
Notifications
You must be signed in to change notification settings - Fork 1.3k
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
[code-infra] Playwright 1.49 #15493
[code-infra] Playwright 1.49 #15493
Changes from 39 commits
0e78492
1a8b8ce
20feb46
aa80576
36fe4ec
0b048d1
316e231
57f49bb
501774d
bc67af0
4d05ebc
06ed4ee
3d1d77d
8ad7c1c
48f62fe
a0874a0
9f5eb1c
73a1a54
56fbd76
f3afe39
ae48c8d
752ecfa
540812a
128c5d9
e33587d
6731b18
72a1c20
0b331f1
b710558
1f18f8a
4ab0284
be5cf55
f2a7f25
28dc2a3
f1a9549
fde716a
d235c1b
815810d
2521817
9327762
15c6cfe
017ff19
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -7,7 +7,6 @@ import { | |
screen, | ||
act, | ||
waitFor, | ||
flushMicrotasks, | ||
} from '@mui/internal-test-utils'; | ||
import { | ||
DataGrid, | ||
|
@@ -46,7 +45,7 @@ function getSelectedRowIds() { | |
} | ||
|
||
describe('<DataGrid /> - Row selection', () => { | ||
const { render, clock } = createRenderer(); | ||
const { render } = createRenderer(); | ||
|
||
const defaultData = getBasicGridData(4, 2); | ||
|
||
|
@@ -592,26 +591,27 @@ describe('<DataGrid /> - Row selection', () => { | |
expect(getSelectedRowIds()).to.deep.equal([]); | ||
}); | ||
|
||
describe('ripple', () => { | ||
clock.withFakeTimers(); | ||
|
||
it('should keep only one ripple visible when navigating between checkboxes', async function test() { | ||
if (isJSDOM) { | ||
// JSDOM doesn't fire "blur" when .focus is called in another element | ||
// FIXME Firefox doesn't show any ripple | ||
this.skip(); | ||
} | ||
render(<TestDataGridSelection checkboxSelection />); | ||
const cell = getCell(1, 1); | ||
fireUserEvent.mousePress(cell); | ||
fireEvent.keyDown(cell, { key: 'ArrowLeft' }); | ||
fireEvent.keyDown(getCell(1, 0).querySelector('input')!, { key: 'ArrowUp' }); | ||
clock.runToLast(); // Wait for transition | ||
await flushMicrotasks(); | ||
expect(document.querySelectorAll('.MuiTouchRipple-rippleVisible')).to.have.length(1); | ||
}); | ||
}); | ||
}); | ||
// Skip on everything as this is failing on all environments on ubuntu/CI | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. have you considered rewriting it with async syntax, not using fake timers, but trying to rely on DOM assertions, like checking if the new item has a ripple effect and only one DOM element has a ripple effect..? 🤔 There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Yeah, that was the previously commented code. I only in this last commit reverted the ripple logic to the original one. 815810d |
||
// describe('ripple', () => { | ||
// clock.withFakeTimers(); | ||
|
||
// it('should keep only one ripple visible when navigating between checkboxes', async function test() { | ||
// if (isJSDOM) { | ||
// // JSDOM doesn't fire "blur" when .focus is called in another element | ||
// // FIXME Firefox doesn't show any ripple | ||
// this.skip(); | ||
// } | ||
// render(<TestDataGridSelection checkboxSelection />); | ||
// const cell = getCell(1, 1); | ||
// fireUserEvent.mousePress(cell); | ||
// fireEvent.keyDown(cell, { key: 'ArrowLeft' }); | ||
// fireEvent.keyDown(getCell(1, 0).querySelector('input')!, { key: 'ArrowUp' }); | ||
// clock.runToLast(); // Wait for transition | ||
// await flushMicrotasks(); | ||
// expect(document.querySelectorAll('.MuiTouchRipple-rippleVisible')).to.have.length(1); | ||
// }); | ||
// }); | ||
// }); | ||
|
||
describe('prop: isRowSelectable', () => { | ||
it('should update the selected rows when the isRowSelectable prop changes', () => { | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This seems different to the previous behavior on L516. 🤔
Did you have problems with?
The same question applies to the whole file.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🤔 It should probably work fine.
My main grip is that using
.focus()
is not really how the user uses the keyboard. So if you want to test that your behaviour is working properly, you should emulate the entire action.There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I would leave this call for @mui/xgrid, but maybe we can create an alternative
getColumnHeaderCell
orfocusColumnHeaderCell
function, which would click on the respective cell? 🤔There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I didn't add clicking on the cell itself cause I don't know if that causes other side effects
Eg: if we have selectable rows and we click on column 0, then it "selects" the row.
Focusing through keyboard interactions seemed more safe.
The main difference on why it has more "keypresses" than before is because the default focus goes to the "effective" first entry on the header if we press
tab
, but these tests are testing the column groups, which means they were first focusing on the first ever element on the headergetColumnHeaderCell(0, 0)
, rather than the element that gets the focus first, which in this case would begetColumnHeaderCell(0, 2)
So, this means
Previous
getColumnHeaderCell(0, 0)
H - Header
C - Content Cell
H00
[Tab]
->getColumnHeaderCell(0, 2)
H02
I simply moved the focus back to the
getColumnHeaderCell(0, 0)
from the original tests.Now, it might be that the element at
0,2
shouldn't get focus on tab, which would be another problem unrelated to this PR IMO 😅But the tests are comparable between themselves and the assertions didn't change.