Editor integration tests

[apedroferreira]

Closes #758

Refactored to use Playright's Page Object Model as we intended.

• I have followed (at least) the PR section of the contributing guide.

[render]

Your Render PR Server URL is https://toolpad-pr-831.onrender.com.

Follow its progress at https://dashboard.render.com/web/srv-cbvsek82i3moe6r0v3qg.

[apedroferreira]

Looks like we have to use the overlay element to capture clicks/drags, as it's the one that captures them. It doesn't work with other elements in the same position.
Also I don't plan to add lots of test ids but I think that for these specific elements it was the best choice.

Let me know if you think anything should be different in terms of how i reorganized some files and their structure a bit too!

[apedroferreira]

Will add a couple of tests for prop controls in a separate PR now too.

[apedroferreira]

@Janpot
CI passed 3 times in a row, maybe it's ok to merge this now?
i had to dispatch events manually in Firefox, couldn't find a better way.
If these tests start being flaky later though we can skip them temporarily and i can work on them a bit more - locally they always pass for me but CI seems a bit more unpredictable.

[Janpot]

Is there a ticket in the playwright repo that we can link to that describes the faulty behavior in firefox? If not, have you tried creating a minimal reproduction? Perhaps you can open a ticket and link to it?

I don't like to add hacks for bugs without adding documentation that can tell us more about the status of said bug. (example: https://github.com/mui/mui-toolpad/blob/4f71c00b28c8e57d9bad5ff99ede85f1d1aecc45/packages/toolpad-app/src/components/SplitPane.tsx#L58)

When there's a proper way forward towards solving the firefox issue in the future, then I'm fine merging this.

[apedroferreira]

Is there a ticket in the playwright repo that we can link to that describes the faulty behavior in firefox? If not, have you tried creating a minimal reproduction? Perhaps you can open a ticket and link to it?

I don't like to add hacks for bugs without adding documentation that can tell us more about the status of said bug. (example:

https://github.com/mui/mui-toolpad/blob/4f71c00b28c8e57d9bad5ff99ede85f1d1aecc45/packages/toolpad-app/src/components/SplitPane.tsx#L58

)
When there's a proper way forward towards solving the firefox issue in the future, then I'm fine merging this.

i couldn't find a proper related issue in the Playwright repo, and yeah i thought about creating one myself, just takes a bit of work to create a reproduction. i'm working on it, there's probably no rush to merge this so we can wait

[render]

Your Render PR Server URL is https://toolpad-pr-831.onrender.com.

Follow its progress at https://dashboard.render.com/web/srv-cck9b12rrk04c7mi4dd0.

[apedroferreira]

Is there a ticket in the playwright repo that we can link to that describes the faulty behavior in firefox? If not, have you tried creating a minimal reproduction? Perhaps you can open a ticket and link to it?

I don't like to add hacks for bugs without adding documentation that can tell us more about the status of said bug. (example:

https://github.com/mui/mui-toolpad/blob/4f71c00b28c8e57d9bad5ff99ede85f1d1aecc45/packages/toolpad-app/src/components/SplitPane.tsx#L58

)
When there's a proper way forward towards solving the firefox issue in the future, then I'm fine merging this.

I've managed to reproduce the bug in a minimal reproduction:
microsoft/playwright#17441

So it's confirmed, seems like there's a specific issue with triggering HTML5 drag & drop events in iFrames, in Firefox only.

I've included a link to the issue I created now, so will merge this PR if the tests seem stable in CI.

[Janpot]

great 👌

[Janpot]

@apedroferreira Following up on the playwright issue, it seems that it's closed due to the closing of microsoft/playwright#17153 (would have been nice of them to reference that issue). Does calling hover() twice fix the issue?

[apedroferreira]

@apedroferreira Following up on the playwright issue, it seems that it's closed due to the closing of microsoft/playwright#17153 (would have been nice of them to reference that issue). Does calling hover() twice fix the issue?

looks like they're supposed to have fixed it, i'll try removing the Firefox specific logic and see if things work now

[apedroferreira]

or i guess they might not have fixed it after all?
i'll try things from that issue then, maybe using hover twice works