fix: resolve attributes function not handling states correctly (#2064)

* fix: resolve attributes function not handling states correctly

src/components/sbb-button/sbb-button.spec.ts

@@ -28,7 +28,7 @@ describe('sbb-button', () => {
         disabled
         aria-disabled="true"
         name="name"
-        value="value"
+        value="value"     
         form="formid"
         role="button"
         dir="ltr"
@@ -165,15 +165,14 @@ describe('sbb-button', () => {
     expect(root).to.have.attribute('data-icon-only');
   });
 
-  // TODO-Migr: enable this test after the FormField migration
-  it.skip('should render form field button variant when inside of a form field', async () => {
+  it('should render form field button variant when inside of a form field', async () => {
     const root = await fixture(
       html` <sbb-form-field>
         <input />
         <sbb-button slot="suffix" icon-name="cross-small" />
       </sbb-form-field>`,
     );
 
-    expect(root).to.have.attribute('data-icon-small');
+    expect(root.querySelector('sbb-button')).to.have.attribute('data-icon-small');
   });
 });

src/components/sbb-link/sbb-link.spec.ts

@@ -26,7 +26,6 @@ describe('sbb-link', () => {
         tabindex="0"
         dir="ltr"
       >
-        
         Travelcards & tickets.
       </sbb-link>
     `);
@@ -73,7 +72,6 @@ describe('sbb-link', () => {
         aria-disabled="true"
         dir="ltr"
       >
-        
         <sbb-icon name="chevron-small-right-small" slot="icon" role="img" aria-hidden="true" data-namespace="default"></sbb-icon>
         Travelcards &amp; tickets.
       </sbb-link>

src/components/sbb-menu-action/sbb-menu-action.spec.ts

@@ -12,7 +12,7 @@ describe('sbb-menu-action', () => {
 
     expect(root).dom.to.be.equal(
       `
-        <sbb-menu-action form="formid" name="name" type="submit" role="button" tabindex="0" dir="ltr">
+        <sbb-menu-action  form="formid" name="name" type="submit" role="button" tabindex="0" dir="ltr">
           <span>Action</span>
         </sbb-menu-action>
       `,
@@ -47,7 +47,7 @@ describe('sbb-menu-action', () => {
 
     expect(root).dom.to.be.equal(
       `
-        <sbb-menu-action amount="123456" icon-name="menu-small" href="https://github.com/lyne-design-system/lyne-components" target="_blank" role="link" tabindex="0" dir="ltr">
+        <sbb-menu-action  amount="123456" icon-name="menu-small" href="https://github.com/lyne-design-system/lyne-components" target="_blank" role="link" tabindex="0" dir="ltr">
           <span>Action</span>
         </sbb-menu-action>
       `,

src/components/sbb-toggle-check/sbb-toggle-check.spec.ts

@@ -73,7 +73,6 @@ describe('sbb-toggle-check', () => {
         expect(root).dom.to.be.equal(
           `
           <sbb-toggle-check size="s" aria-checked="true" aria-disabled="false" aria-required="false" checked label-position="after" role="checkbox" tabindex="0">
-            
           </sbb-toggle-check>
         `,
         );

src/global/interfaces/link-button-properties.ts

@@ -113,7 +113,9 @@ function getLinkAttributeList(linkProperties: LinkProperties): Record<string, st
 function hostProperties(role: string, disabled: boolean): Record<string, string> {
   return Object.assign(
     { role, dir: getDocumentWritingMode() },
-    disabled ? { 'aria-disabled': 'true' } : { tabIndex: '0' },
+    disabled
+      ? { 'aria-disabled': 'true', tabIndex: null }
+      : { 'aria-disabled': null, tabIndex: '0' },
   );
 }