Label (v8): convert tests to use testing-library (#22211)

microsoft · Mar 28, 2022 · f80b990 · f80b990
1 parent f10cc04
commit f80b990
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 34 deletions.
diff --git a/packages/react/src/components/Label/Label.test.tsx b/packages/react/src/components/Label/Label.test.tsx
@@ -1,19 +1,18 @@
 import * as React from 'react';
-import { mount } from 'enzyme';
-import * as renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import { isConformant } from '../../common/isConformant';
 import { Label } from './Label';
 
 describe('Label', () => {
   it('renders a label', () => {
-    const label = mount(<Label>test</Label>);
-    expect(label.text()).toEqual('test');
+    const { container } = render(<Label>test</Label>);
+    const label = container.querySelector('label');
+    expect(label!.textContent).toEqual('test');
   });
 
   it('renders label correctly', () => {
-    const component = renderer.create(<Label>test</Label>);
-    const tree = component.toJSON();
-    expect(tree).toMatchSnapshot();
+    const { container } = render(<Label>test</Label>);
+    expect(container).toMatchSnapshot();
   });
 
   isConformant({

diff --git a/packages/react/src/components/Label/__snapshots__/Label.test.tsx.snap b/packages/react/src/components/Label/__snapshots__/Label.test.tsx.snap
@@ -1,31 +1,33 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Label renders label correctly 1`] = `
-<label
-  className=
-      ms-Label
-      {
-        -moz-osx-font-smoothing: grayscale;
-        -webkit-font-smoothing: antialiased;
-        box-shadow: none;
-        box-sizing: border-box;
-        color: #323130;
-        display: block;
-        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
-        font-size: 14px;
-        font-weight: 600;
-        margin-bottom: 0px;
-        margin-left: 0px;
-        margin-right: 0px;
-        margin-top: 0px;
-        overflow-wrap: break-word;
-        padding-bottom: 5px;
-        padding-left: 0;
-        padding-right: 0;
-        padding-top: 5px;
-        word-wrap: break-word;
-      }
->
-  test
-</label>
+<div>
+  <label
+    class=
+        ms-Label
+        {
+          -moz-osx-font-smoothing: grayscale;
+          -webkit-font-smoothing: antialiased;
+          box-shadow: none;
+          box-sizing: border-box;
+          color: #323130;
+          display: block;
+          font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+          font-size: 14px;
+          font-weight: 600;
+          margin-bottom: 0px;
+          margin-left: 0px;
+          margin-right: 0px;
+          margin-top: 0px;
+          overflow-wrap: break-word;
+          padding-bottom: 5px;
+          padding-left: 0;
+          padding-right: 0;
+          padding-top: 5px;
+          word-wrap: break-word;
+        }
+  >
+    test
+  </label>
+</div>
 `;