Keyboard commands to zoom in and out should only impact the preview canvas

Tested manually and seems to work as expected! 🤩

@fazilitehreem Is this something we could add automated Cypress tests for?

Not sure @laurii, we can add some test to check

@fazilitehreem Is this something you'd like to do?

Moving to needs work to indicate that we have some progress here 😊

Changing status to Needs work to write test case for zoom reset and to fix a bug that I found while writing test case.

Tests are present 👍

Bumping to since @lauriii added this to 🌱 Milestone 0.1.0: Experience Builder Demo Active .

I'm afraid I have quite a bit of feedback!

The zoom commands (CMD/CTRL and + CMD/CTRL and -) are currently zooming the whole interface due to default browser behavior.

This seems to be fixed but the new test introduced in this MR is not actually testing that. TBC if it's even possible to test that the default browser behaviour is being prevented in a Cypress test!

There seems to a bug that means that pinch-zooming on a trackpad on Mac can also sometimes zoom the whole browser, this should also be addressed here.

This is not addressed yet. (mouse moving between iframe and parent during the zoom action causes it) - lets raise another issue for this specifically.

The MR is adding the ability to press the 0 key to reset the zoom but

1. If you focus in the iframe and then press (specifically) NUMPAD0 it doesn't pass that event up to the parent. (The other 0 key works)
2. The new test introduced does not test for the above usecase.

If you zoom to an irregular zoom amount (like 83% instead of one of the zoom amounts listed in the dropdown) using pinch zoom (or ctrl + mouse wheel) and then press +, the zoom snaps to 25%. I don't know if this was introduced in this MR.

@jessebaker,

If you zoom to an irregular zoom amount (like 83% instead of one of the zoom amounts listed in the dropdown) using pinch zoom (or ctrl + mouse wheel) and then press +, the zoom snaps to 25%. I don't know if this was introduced in this MR.

For this, we already have an issue that needs to be reviewed.
Zoom Behaviour Issue: Clicking Plus Button Resets Zoom Level Before Gradually Increasing 🐛 Zoom Behaviour Issue: Clicking Plus Button Resets Zoom Level Before Gradually Increasing Needs review

@jessebaker!

There seems to a bug that means that pinch-zooming on a trackpad on Mac can also sometimes zoom the whole browser, this should also be addressed here.

I know for this ☝️ we are about to create an separate issue still I tried to fix this using touch-action: none; and other JS/React ways but no luck.

Apart from this ☝️ I tried to write a test case 👇 in cypress to validate default browser behaviour on zoom in/out but again found nothing related to this in cypress.

This seems to be fixed but the new test introduced in this MR is not actually testing that. TBC if it's even possible to test that the default browser behaviour is being prevented in a Cypress test!

For this 👇 I cannot check as my external keyboard having numeric pad is not working with my Mac by the way are the other keys plus/minus(+/-) for zoom in/out using numeric pad are passing the test?

If you focus in the iframe and then press (specifically) NUMPAD0 it doesn't pass that event up to the parent. (The other 0 key works)