Fix slug heading styles in Heading component

src/components/Headings/heading.test.tsx

@@ -89,10 +89,10 @@ describe('<Heading />', () => {
 
     expect(wrapper).toBeInTheDocument();
     expect(wrapper.tagName.toLowerCase()).toBe('header');
-    expect(wrapper.classList.contains('m-slug-header'));
+    expect(wrapper.classList.contains('m-slug-header')).toBeTruthy();
 
     const content = screen.getByText(text);
     expect(content.tagName.toLowerCase()).toBe('h2');
-    expect(content.classList.contains('a-heading'));
+    expect(content.classList.contains('m-slug-header__heading')).toBeTruthy();
   });
 });

src/components/Headings/heading.tsx

@@ -1,3 +1,4 @@
+import '@cfpb/cfpb-design-system/src/components/cfpb-typography/slug-header.scss';
 import classnames from 'classnames';
 import { JSX } from 'react';
 import type { HTMLProps } from 'react';

src/components/Headings/headings.stories.tsx

@@ -97,4 +97,18 @@ export const Slug: Story = {
     type: 'slug',
     children: 'Slug',
   },
+  play: async ({ canvasElement }) => {
+    const canvas = within(canvasElement);
+    const slugHeading = canvas.getByRole('heading', {
+      level: 2,
+      name: /slug/i,
+    });
+
+    await expect(slugHeading.classList.contains('m-slug-header__heading')).toBe(
+      true,
+    );
+    await expect(
+      slugHeading.closest('header')?.classList.contains('m-slug-header'),
+    ).toBe(true);
+  },
 };