From 406d992b415d939adcb8eecbd4089c830138d9dd Mon Sep 17 00:00:00 2001
From: Niklas Kiefer <niklas.kiefer@camunda.com>
Date: Tue, 10 Oct 2023 14:13:24 +0200
Subject: [PATCH] test(a11y): remove scrollable rule for palette

This is resolved now :tada:
---
 e2e/visual/no-theme.spec.js                          |  5 -----
 e2e/visual/theming.spec.js                           |  5 -----
 .../form-js-editor/assets/form-js-editor-base.css    |  2 ++
 packages/form-js-editor/test/spec/FormEditor.spec.js | 12 +-----------
 4 files changed, 3 insertions(+), 21 deletions(-)

diff --git a/e2e/visual/no-theme.spec.js b/e2e/visual/no-theme.spec.js
index 16f4ac55e..b22b2ca20 100644
--- a/e2e/visual/no-theme.spec.js
+++ b/e2e/visual/no-theme.spec.js
@@ -77,13 +77,8 @@ test('no-theme - editor', async ({ page, makeAxeBuilder }) => {
   await expect(page).toHaveScreenshot();
 
   // and then
-  // @Note(pinussilvestrus): the palette entries are currently
-  // not keyboard accessible, as we need to invest in an overall
-  // editor keyboard experience
-  // cf. https://github.com/bpmn-io/form-js/issues/536
   const results = await makeAxeBuilder({
     disableRules: [
-      'scrollable-region-focusable',
       'page-has-heading-one'
     ]
   }).analyze();
diff --git a/e2e/visual/theming.spec.js b/e2e/visual/theming.spec.js
index 69dcd20b5..20b5158c1 100644
--- a/e2e/visual/theming.spec.js
+++ b/e2e/visual/theming.spec.js
@@ -77,13 +77,8 @@ test('theming - editor', async ({ page, makeAxeBuilder }) => {
   await expect(page).toHaveScreenshot();
 
   // and then
-  // @Note(pinussilvestrus): the palette entries are currently
-  // not keyboard accessible, as we need to invest in an overall
-  // editor keyboard experience
-  // cf. https://github.com/bpmn-io/form-js/issues/536
   const results = await makeAxeBuilder({
     disableRules: [
-      'scrollable-region-focusable',
       'page-has-heading-one'
     ]
   }).analyze();
diff --git a/packages/form-js-editor/assets/form-js-editor-base.css b/packages/form-js-editor/assets/form-js-editor-base.css
index 2c62beaeb..9d6ead48b 100644
--- a/packages/form-js-editor/assets/form-js-editor-base.css
+++ b/packages/form-js-editor/assets/form-js-editor-base.css
@@ -628,6 +628,7 @@
   font-size: 11px;
   align-items: center;
   border: none;
+  font-family: inherit;
   user-select: none;
   color: var( --color-palette-field);
   background: var(--color-palette-field-background);
@@ -648,6 +649,7 @@
 
 .fjs-palette-field .fjs-palette-field-text {
   text-align: center;
+  width: inherit;
 }
 
 .fjs-palette-container .fjs-palette-field:hover {
diff --git a/packages/form-js-editor/test/spec/FormEditor.spec.js b/packages/form-js-editor/test/spec/FormEditor.spec.js
index d9675a000..7ea3f2013 100644
--- a/packages/form-js-editor/test/spec/FormEditor.spec.js
+++ b/packages/form-js-editor/test/spec/FormEditor.spec.js
@@ -1501,17 +1501,7 @@ describe('FormEditor', function() {
       });
 
       // then
-      // @Note(pinussilvestrus): the palette entries are currently
-      // not keyboard accessible, as we need to invest in an overall
-      // editor keyboard experience
-      // cf. https://github.com/bpmn-io/form-js/issues/536
-      await expectNoViolations(container, {
-        rules: {
-          'scrollable-region-focusable': {
-            enabled: false
-          }
-        }
-      });
+      await expectNoViolations(container);
     });
 
   });