fix(PPDSC-2108): handle different browser zoom level in scroll tests

[mstuartf]

PPDSC-2108

What

1. Background: The scroll component Cypress tests fail if the browser’s zoom !== 100%. This is because when the browser is zoomed in or out scrollTop and scrollLeft are floating points not integers, but the test assertions assume they will always be integers. There is some logic already in the component to handle the behaviour of scrollTop and scrollLeft at different zoom levels. Mirroring this logic in the tests will ensure they pass at all zoom levels.
2. Update scroll component tests to handle different browser zoom (using SCROLL_THRESHOLD logic from component).

I have done:

• Written unit tests against changes
• Written functional tests against the component and/or NewsKit site
• Updated relevant documentation

I have tested manually:

• The feature's functionality is working as expected on Chrome, Firefox, Safari and Edge
• The screen reader reads and flows through the elements as expected.
• There are no new errors in the browser console coming from this PR.
• When visual test is not added, it renders correctly on different browsers and mobile viewports (Safari, Firefox, small mobile viewport, tablet)
• The Playground feature is working as expected

How to test:

• Run yarn e2e:comps with browser zoom !== 100%

[newskit-engineering]

You can preview these changes on:
Documentation Site: http://ncu-newskit-docs.s3-website-eu-west-1.amazonaws.com/ppdsc-2108-handle-browser-zoom-in-scroll-tests
Storybook: http://ncu-newskit-docs.s3-website-eu-west-1.amazonaws.com/ppdsc-2108-handle-browser-zoom-in-scroll-tests/storybook

[mutebg]

Good one 👏

[Srinivasan-Ramasamy]

Nice 👍