From 1310bd491e5363ec86159c1ae390964b1fb9cc16 Mon Sep 17 00:00:00 2001
From: Thijs Louisse <Thijs.Louisse@ing.com>
Date: Thu, 27 Feb 2020 11:27:25 +0100
Subject: [PATCH] fix(form): leave accessible role to native form

---
 packages/form/src/LionForm.js        |  8 +++-----
 packages/form/test/lion-form.test.js | 22 ++++++++++++++++++++++
 2 files changed, 25 insertions(+), 5 deletions(-)

diff --git a/packages/form/src/LionForm.js b/packages/form/src/LionForm.js
index 78d699fb5..257716533 100644
--- a/packages/form/src/LionForm.js
+++ b/packages/form/src/LionForm.js
@@ -13,6 +13,9 @@ export class LionForm extends LionFieldset {
       super.connectedCallback();
     }
     this.__registerEventsForLionForm();
+
+    // @override LionFieldset: makes sure a11y is handled by ._formNode
+    this.removeAttribute('role');
   }
 
   disconnectedCallback() {
@@ -34,11 +37,6 @@ export class LionForm extends LionFieldset {
     this._formNode.reset();
   }
 
-  /**
-   * As we use a native form there is no need for a role
-   */
-  _setRole() {} // eslint-disable-line class-methods-use-this
-
   __registerEventsForLionForm() {
     this._submit = ev => {
       ev.preventDefault();
diff --git a/packages/form/test/lion-form.test.js b/packages/form/test/lion-form.test.js
index 7d47652eb..4fab34101 100644
--- a/packages/form/test/lion-form.test.js
+++ b/packages/form/test/lion-form.test.js
@@ -9,8 +9,10 @@ import {
 } from '@open-wc/testing';
 import { spy } from 'sinon';
 import { LionField } from '@lion/field';
+import { LionFieldset } from '@lion/fieldset';
 import '@lion/field/lion-field.js';
 import '@lion/fieldset/lion-fieldset.js';
+
 import '../lion-form.js';
 
 const childTagString = defineCE(
@@ -27,6 +29,26 @@ const formTagString = 'lion-form';
 const formTag = unsafeStatic(formTagString);
 
 describe('<lion-form>', () => {
+  it('is an instance of LionFieldSet', async () => {
+    const el = await fixture(html`
+      <${formTag}>
+        <form>
+        </form>
+      </${formTag}>
+    `);
+    expect(el).to.be.instanceOf(LionFieldset);
+  });
+
+  it('relies on the native form for its accessible role', async () => {
+    const el = await fixture(html`
+      <${formTag}>
+        <form>
+        </form>
+      </${formTag}>
+    `);
+    expect(el.getAttribute('role')).to.be.null;
+  });
+
   it('has a custom reset that gets triggered by native reset', async () => {
     const withDefaults = await fixture(html`
       <${formTag}>