test: [M3-8951] - Cypress tests for firewall rules drag and drop keyboard interaction

[pmakode-akamai]

Description 📝

Add cypress test for firewall rules table drag and drop keyboard interaction which was enhanced in #11127

• These tests confirm that the keyboard interaction for the Firewall Rules table's drag-and-drop feature works as expected.
• The tests also validate that the CustomKeyboardSensor functions correctly:
  • We have customized the default KeyboardSensor from dnd-kit to meet our specific requirements.
  • The sensor we are using is CustomKeyboardSensor, rather than the default KeyboardSensor from dnd-kit.
  • CustomKeyboardSensor works as expected on smaller window sizes, especially when the vertical scrollbar is enabled. In contrast, the default KeyboardSensor from dnd-kit does not function as intended in this scenario.

Changes 🔄

• Add Cypress tests for firewall rules drag and drop keyboard interaction
• Add/Improve comments

Target release date 🗓️

N/A

How to test 🧪

yarn cy:run -s "cypress/e2e/core/firewalls/firewall-rules-drag-and-drop-keyboard.spec.ts"

OR

Test firewall-rules-drag-and-drop-keyboard.spec.ts using

yarn cy:debug

• Ensure all tests pass.
• Confirm CustomKeyboardSensor works as expected (both for normal window sizes and when a smaller window with a vertical scrollbar is enabled).
  • This can be tested against both CustomKeyboardSensor and the dnd-kit default KeyboardSensor.
    • To test this scenario, replace CustomKeyboardSensor with the default KeyboardSensor from dnd-kit in the FirewallRuleTable.tsx component, and vice-versa.
    • All the tests should pass when using CustomKeyboardSensor and some of the tests (related to vertical scrollbar) will fail when using the default KeyboardSensor, confirming that CustomKeyboardSensor is functioning correctly.

Author Checklists

As an Author, to speed up the review process, I considered 🤔

👀 Doing a self review
❔ Our contribution guidelines
🤏 Splitting feature into small PRs
➕ Adding a changeset
🧪 Providing/improving test coverage
🔐 Removing all sensitive information from the code and PR description
🚩 Using a feature flag to protect the release
👣 Providing comprehensive reproduction steps
📑 Providing or updating our documentation
🕛 Scheduling a pair reviewing session
📱 Providing mobile support
♿ Providing accessibility support

• I have read and considered all applicable items listed above.

As an Author, before moving this PR from Draft to Open, I confirmed ✅

• All unit tests are passing
• TypeScript compilation succeeded without errors
• Code passes all linting rules

[abailly-akamai]

Thanks for working on this!

@jdamore-linode wouldn't such a test belong to our component test suite?

Perhaps both have their use, but worth checking

[github-actions]

Coverage Report: ✅
Base Coverage: 86.95%
Current Coverage: 86.95%

[linode-gh-bot]

Cloud Manager UI test results

🎉 470 passing tests on test run #10 ↗︎

❌ Failing	✅ Passing	↪️ Skipped	🕐 Duration
0 Failing	470 Passing	2 Skipped	96m 43s