Convert Welcome component to tlr.

MetaMask · Aug 31, 2022 · 8f7e7f1 · 8f7e7f1
1 parent d0c1dc7
commit 8f7e7f1
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 24 deletions.
diff --git a/ui/pages/first-time-flow/welcome/welcome.component.js b/ui/pages/first-time-flow/welcome/welcome.component.js
@@ -71,6 +71,7 @@ export default class Welcome extends PureComponent {
             type="primary"
             className="first-time-flow__button"
             onClick={this.handleContinue}
+            data-testid="first-time-flow__button"
           >
             {t('getStarted')}
           </Button>

diff --git a/ui/pages/first-time-flow/welcome/welcome.test.js b/ui/pages/first-time-flow/welcome/welcome.test.js
@@ -1,16 +1,10 @@
 import React from 'react';
 import sinon from 'sinon';
-import configureMockStore from 'redux-mock-store';
-import { mountWithRouter } from '../../../../test/lib/render-helpers';
+import { fireEvent, screen } from '@testing-library/react';
+import { renderWithProvider } from '../../../../test/lib/render-helpers';
 import Welcome from './welcome.container';
 
 describe('Welcome', () => {
-  const mockStore = {
-    metamask: {},
-  };
-
-  const store = configureMockStore()(mockStore);
-
   afterAll(() => {
     sinon.restore();
   });
@@ -22,15 +16,13 @@ describe('Welcome', () => {
       },
     };
 
-    const wrapper = mountWithRouter(
-      <Welcome.WrappedComponent {...props} />,
-      store,
-    );
+    renderWithProvider(<Welcome.WrappedComponent {...props} />);
 
-    const getStartedButton = wrapper.find(
-      '.btn-primary.first-time-flow__button',
-    );
-    getStartedButton.simulate('click');
+    const getStartedButton = screen.getByTestId('first-time-flow__button');
+
+    fireEvent.click(getStartedButton);
+
+    // getStartedButton.simulate('click');
     expect(props.history.push.getCall(0).args[0]).toStrictEqual(
       '/initialize/metametrics-opt-in',
     );
@@ -45,15 +37,12 @@ describe('Welcome', () => {
       },
     };
 
-    const wrapper = mountWithRouter(
-      <Welcome.WrappedComponent {...props} />,
-      store,
-    );
+    renderWithProvider(<Welcome.WrappedComponent {...props} />);
 
-    const getStartedButton = wrapper.find(
-      '.btn-primary.first-time-flow__button',
-    );
-    getStartedButton.simulate('click');
+    const getStartedButton = screen.getByTestId('first-time-flow__button');
+
+    // getStartedButton.simulate('click');
+    fireEvent.click(getStartedButton);
     expect(props.history.push.getCall(0).args[0]).toStrictEqual(
       '/initialize/select-action',
     );