Fix bug when using spread, or prop variable for as

Author: TylerJDev

src/rules/__tests__/a11y-explicit-heading.test.js

@@ -22,6 +22,19 @@ ruleTester.run('a11y-explicit-heading', rule, {
   `import {Heading} from '@primer/react';
   <Heading as="H3">Heading level 3</Heading>
   `,
+  `import {Heading} from '@primer/react';
+  const args = {};
+  <Heading {...args}>A heading with spread props</Heading>
+  `,
+  `import {Heading} from '@primer/react';
+  const as = 'h3';
+  <Heading as={as}>Heading as passed prop</Heading>
+  `,
+  `import {Heading} from '@primer/react';
+  const args = {};
+  <Heading as="h2" {...args}>Heading level 2</Heading>
+  `,
+  
 ],
 invalid: [    
   {

src/rules/a11y-explicit-heading.js

@@ -15,10 +15,12 @@ const isUsingAsProp = elem => {
 
 const isValidAsUsage = value => validHeadings.includes(value.toLowerCase())
 const isInvalid = elem => {
+  if (elem.attributes.length === 1 && elem.attributes[0].type === 'JSXSpreadAttribute') return;
+
   const elemAs = isUsingAsProp(elem)
 
   if (!elemAs) return 'nonExplicitHeadingLevel'
-  if (!isValidAsUsage(elemAs.value)) return 'invalidAsValue'
+  if (elemAs?.value && !isValidAsUsage(elemAs.value)) return 'invalidAsValue'
 
   return false
 }
@@ -57,4 +59,4 @@ module.exports = {
       }
     }
   }
-}
+}