auth0-lock 15.0.0 → 15.0.1

package/lib/__tests__/field/email_pane.js

@@ -2,7 +2,7 @@
 
 var _react = _interopRequireDefault(require("react"));
 var _immutable = _interopRequireDefault(require("immutable"));
-var _enzyme = require("enzyme");
+var _react2 = require("@testing-library/react");
 var _testUtils = require("testUtils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 jest.mock('ui/input/email_input', function () {
@@ -83,9 +83,13 @@ describe('EmailPane', function () {
       };
     });
   });
-  it('renders correctly', function () {
+  it('renders correctly with isValid=false when `isFieldVisiblyInvalid` is true', function () {
     var EmailPane = getComponent();
-    (0, _testUtils.expectComponent)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps)).toMatchSnapshot();
+    var _render = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps)),
+      container = _render.container;
+    var props = (0, _testUtils.getMockProps)(container.querySelector('[data-__type="email_input"]'));
+    expect(props.isValid).toBe(false);
+    expect(props.autoComplete).toBe(false);
   });
   it('sets `blankErrorHint` when username is empty', function () {
     var fieldIndexMock = require('field/index');
@@ -101,28 +105,38 @@ describe('EmailPane', function () {
       });
     };
     var EmailPane = getComponent();
-    (0, _testUtils.expectComponent)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps)).toMatchSnapshot();
+    var _render2 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps)),
+      container = _render2.container;
+    var props = (0, _testUtils.getMockProps)(container.querySelector('[data-__type="email_input"]'));
+    expect(props.isValid).toBe(false);
+    expect(props.invalidHint).toBe('blankErrorHint');
   });
   it('sets isValid as true when `isFieldVisiblyInvalid` is false', function () {
     require('field/index').isFieldVisiblyInvalid = function () {
       return false;
     };
     var EmailPane = getComponent();
-    (0, _testUtils.expectComponent)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps)).toMatchSnapshot();
+    var _render3 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps)),
+      container = _render3.container;
+    var props = (0, _testUtils.getMockProps)(container.querySelector('[data-__type="email_input"]'));
+    expect(props.isValid).toBe(true);
   });
   it('sets autoComplete to true when `allowAutocomplete` is true', function () {
     require('core/index').ui.allowAutocomplete = function () {
       return true;
     };
     var EmailPane = getComponent();
-    (0, _testUtils.expectComponent)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps)).toMatchSnapshot();
+    var _render4 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps)),
+      container = _render4.container;
+    var props = (0, _testUtils.getMockProps)(container.querySelector('[data-__type="email_input"]'));
+    expect(props.autoComplete).toBe(true);
   });
   it('fetches the avatar on componentDidMount if ui.avatar is true and there is a username', function () {
     require('core/index').ui.avatar = function () {
       return true;
     };
     var EmailPane = getComponent();
-    (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps));
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps));
     var mock = require('avatar').requestAvatar.mock;
     expect(mock.calls.length).toBe(1);
   });
@@ -131,8 +145,9 @@ describe('EmailPane', function () {
       return true;
     };
     var EmailPane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper);
+    var _render5 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps)),
+      container = _render5.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'email_input');
     props.onChange({
       target: {
         value: 'newUser@example.com'
@@ -143,8 +158,9 @@ describe('EmailPane', function () {
   });
   it('calls `swap` onChange', function () {
     var EmailPane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper);
+    var _render6 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(EmailPane, defaultProps)),
+      container = _render6.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'email_input');
     props.onChange({
       target: {
         value: 'newUser@example.com'

package/lib/__tests__/field/login_pane.js

@@ -1,7 +1,7 @@
 "use strict";
 
 var _react = _interopRequireDefault(require("react"));
-var _enzyme = require("enzyme");
+var _react2 = require("@testing-library/react");
 var _testUtils = require("testUtils");
 var _login_pane = _interopRequireDefault(require("connection/database/login_pane"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -106,8 +106,11 @@ describe('LoginPane', function () {
     databaseIndexMock.forgotPasswordLink.mockImplementation(function () {
       return undefined;
     });
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(_login_pane.default, defaultProps));
-    wrapper.find('a.auth0-lock-alternative-link').simulate('click');
+    var _render = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_login_pane.default, defaultProps)),
+      container = _render.container;
+    (0, _react2.act)(function () {
+      container.querySelector('a.auth0-lock-alternative-link').click();
+    });
     var actions = require('connection/database/actions');
     var calls = actions.showResetPasswordActivity.mock.calls;
     expect(calls.length).toBe(1);

package/lib/__tests__/field/mfa_code_pane.js

@@ -1,7 +1,7 @@
 "use strict";
 
 var _react = _interopRequireDefault(require("react"));
-var _enzyme = require("enzyme");
+var _react2 = require("@testing-library/react");
 var _testUtils = require("testUtils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 jest.mock('ui/input/mfa_code_input', function () {
@@ -65,21 +65,28 @@ describe('MFACodePane', function () {
       };
     });
   });
-  it('renders correctly', function () {
+  it('renders correctly with isValid=false when `isFieldVisiblyInvalid` is true', function () {
     var MFACodePane = getComponent();
-    (0, _testUtils.expectComponent)(/*#__PURE__*/_react.default.createElement(MFACodePane, defaultProps)).toMatchSnapshot();
+    var _render = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(MFACodePane, defaultProps)),
+      container = _render.container;
+    var props = (0, _testUtils.getMockProps)(container.querySelector('[data-__type="mfa_code_input"]'));
+    expect(props.isValid).toBe(false);
   });
   it('sets isValid as true when `isFieldVisiblyInvalid` is false', function () {
     require('field/index').isFieldVisiblyInvalid = function () {
       return false;
     };
     var MFACodePane = getComponent();
-    (0, _testUtils.expectComponent)(/*#__PURE__*/_react.default.createElement(MFACodePane, defaultProps)).toMatchSnapshot();
+    var _render2 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(MFACodePane, defaultProps)),
+      container = _render2.container;
+    var props = (0, _testUtils.getMockProps)(container.querySelector('[data-__type="mfa_code_input"]'));
+    expect(props.isValid).toBe(true);
   });
   it('calls `swap` onChange', function () {
     var MFACodePane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(MFACodePane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper);
+    var _render3 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(MFACodePane, defaultProps)),
+      container = _render3.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'mfa_code_input');
     props.onChange({
       target: {
         value: 'newUser'

package/lib/__tests__/field/option_selection_pane.js

@@ -1,9 +1,10 @@
 "use strict";
 
 var _react = _interopRequireDefault(require("react"));
-var _enzyme = require("enzyme");
+var _react2 = require("@testing-library/react");
 var _testUtils = require("testUtils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 jest.mock('ui/list', function () {
   return (0, _testUtils.mockComponent)('list');
 });
@@ -31,14 +32,22 @@ describe('OptionSelectionPane', function () {
       };
     });
   });
-  it('renders correctly', function () {
+  it('renders correctly and passes props to List', function () {
     var OptionSelectionPane = getComponent();
-    (0, _testUtils.expectComponent)(/*#__PURE__*/_react.default.createElement(OptionSelectionPane, defaultProps)).toMatchSnapshot();
+    var _render = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(OptionSelectionPane, defaultProps)),
+      container = _render.container;
+    var props = (0, _testUtils.getMockProps)(container.querySelector('[data-__type="list"]'));
+    expect(props.icon).toBe('icon');
+    expect(props.iconUrl).toBe('iconUrl');
+    expect(props.items).toBe('items');
+    expect(_typeof(props.onSelect)).toBe('function');
+    expect(_typeof(props.onCancel)).toBe('function');
   });
   it('calls `selectOption` when selected', function () {
     var OptionSelectionPane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(OptionSelectionPane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper);
+    var _render2 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(OptionSelectionPane, defaultProps)),
+      container = _render2.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'list');
     props.onSelect('selected');
     var mock = require('field/actions').selectOption.mock;
     expect(mock.calls.length).toBe(1);
@@ -46,8 +55,9 @@ describe('OptionSelectionPane', function () {
   });
   it('calls `cancelOptionSelection` when cancelled', function () {
     var OptionSelectionPane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(OptionSelectionPane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper);
+    var _render3 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(OptionSelectionPane, defaultProps)),
+      container = _render3.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'list');
     props.onCancel();
     var mock = require('field/actions').cancelOptionSelection.mock;
     expect(mock.calls.length).toBe(1);

package/lib/__tests__/field/password_pane.js

@@ -1,7 +1,7 @@
 "use strict";
 
 var _react = _interopRequireDefault(require("react"));
-var _enzyme = require("enzyme");
+var _react2 = require("@testing-library/react");
 var _testUtils = require("testUtils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
@@ -121,8 +121,9 @@ describe('PasswordPane', function () {
   });
   it('calls `swap` when password changes', function () {
     var PasswordPane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(PasswordPane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper, 1);
+    var _render = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(PasswordPane, defaultProps)),
+      container = _render.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'password_input');
     props.onChange({
       target: {
         value: 'newPassword'
@@ -137,13 +138,10 @@ describe('PasswordPane', function () {
       return true;
     };
     var PasswordPane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(PasswordPane, defaultProps));
-    var props = wrapper.find('div input').props();
-    props.onChange({
-      target: {
-        checked: true
-      }
-    });
+    var _render2 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(PasswordPane, defaultProps)),
+      container = _render2.container;
+    var inputEl = container.querySelector('input[type="checkbox"]');
+    _react2.fireEvent.click(inputEl);
     var mock = require('store/index').swap.mock;
     expect(mock.calls.length).toBe(1);
     expect(mock.calls[0]).toMatchSnapshot();

package/lib/__tests__/field/phone_number_pane.js

@@ -1,7 +1,7 @@
 "use strict";
 
 var _react = _interopRequireDefault(require("react"));
-var _enzyme = require("enzyme");
+var _react2 = require("@testing-library/react");
 var _testUtils = require("testUtils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
@@ -87,8 +87,9 @@ describe('PhoneNumberPane', function () {
   });
   it('calls `startOptionSelection` when SelectInput is clicked', function () {
     var PhoneNumberPane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(PhoneNumberPane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper, 1);
+    var _render = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(PhoneNumberPane, defaultProps)),
+      container = _render.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'select_input');
     props.onClick();
     var mock = require('field/actions').startOptionSelection.mock;
     expect(mock.calls.length).toBe(1);
@@ -96,8 +97,9 @@ describe('PhoneNumberPane', function () {
   });
   it('calls `swap` when PhoneNumberInput changes', function () {
     var PhoneNumberPane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(PhoneNumberPane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper, 2);
+    var _render2 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(PhoneNumberPane, defaultProps)),
+      container = _render2.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'phone_number_input');
     props.onChange({
       target: {
         value: 'newPhoneNumber'

package/lib/__tests__/field/social_buttons_pane.js

@@ -1,7 +1,7 @@
 "use strict";
 
 var _react = _interopRequireDefault(require("react"));
-var _enzyme = require("enzyme");
+var _react2 = require("@testing-library/react");
 var _testUtils = require("testUtils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
@@ -94,10 +94,11 @@ describe('SocialButtonsPane', function () {
   });
   it('calls signUpError when isSignUp===true and terms were not accepted', function () {
     var SocialButtonsPane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(SocialButtonsPane, _extends({}, defaultProps, {
-      signUp: true
-    })));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper, 2);
+    var _render = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(SocialButtonsPane, _extends({}, defaultProps, {
+        signUp: true
+      }))),
+      container = _render.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'auth_button');
     props.onClick();
     var mock = require('connection/database/actions').signUpError.mock;
     expect(mock.calls.length).toBe(1);
@@ -117,8 +118,9 @@ describe('SocialButtonsPane', function () {
   });
   it('calls `logIn` with social connection 1 when first button is clicked', function () {
     var SocialButtonsPane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(SocialButtonsPane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper, 2);
+    var _render2 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(SocialButtonsPane, defaultProps)),
+      container = _render2.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'auth_button');
     props.onClick();
     var mock = require('quick-auth/actions').logIn.mock;
     expect(mock.calls.length).toBe(1);
@@ -126,8 +128,9 @@ describe('SocialButtonsPane', function () {
   });
   it('calls `logIn` with social connection 2 when second button is clicked', function () {
     var SocialButtonsPane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(SocialButtonsPane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper, 3);
+    var _render3 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(SocialButtonsPane, defaultProps)),
+      container = _render3.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'auth_button', 1);
     props.onClick();
     var mock = require('quick-auth/actions').logIn.mock;
     expect(mock.calls.length).toBe(1);

package/lib/__tests__/field/username_pane.js

@@ -1,7 +1,7 @@
 "use strict";
 
 var _react = _interopRequireDefault(require("react"));
-var _enzyme = require("enzyme");
+var _react2 = require("@testing-library/react");
 var _testUtils = require("testUtils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
@@ -88,9 +88,13 @@ describe('UsernamePane', function () {
       };
     });
   });
-  it('renders correctly', function () {
+  it('renders correctly with isValid=false when `isFieldVisiblyInvalid` is true', function () {
     var UsernamePane = getComponent();
-    (0, _testUtils.expectComponent)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps)).toMatchSnapshot();
+    var _render = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps)),
+      container = _render.container;
+    var props = (0, _testUtils.getMockProps)(container.querySelector('[data-__type="username_input"]'));
+    expect(props.isValid).toBe(false);
+    expect(props.autoComplete).toBe(false);
   });
   it('sets `blankErrorHint` when username is empty', function () {
     var fieldIndexMock = require('field/index');
@@ -101,7 +105,11 @@ describe('UsernamePane', function () {
       return undefined;
     };
     var UsernamePane = getComponent();
-    (0, _testUtils.expectComponent)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps)).toMatchSnapshot();
+    var _render2 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps)),
+      container = _render2.container;
+    var props = (0, _testUtils.getMockProps)(container.querySelector('[data-__type="username_input"]'));
+    expect(props.isValid).toBe(false);
+    expect(props.invalidHint).toContain('blankErrorHint');
   });
   it('sets `usernameFormatErrorHint` when usernameLooksLikeEmail() returns false and `validateFormat` is true', function () {
     var fieldUsernameMock = require('field/username');
@@ -115,30 +123,39 @@ describe('UsernamePane', function () {
       return false;
     };
     var UsernamePane = getComponent();
-    (0, _testUtils.expectComponent)(/*#__PURE__*/_react.default.createElement(UsernamePane, _extends({}, defaultProps, {
-      validateFormat: true
-    }))).toMatchSnapshot();
+    var _render3 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(UsernamePane, _extends({}, defaultProps, {
+        validateFormat: true
+      }))),
+      container = _render3.container;
+    var props = (0, _testUtils.getMockProps)(container.querySelector('[data-__type="username_input"]'));
+    expect(props.invalidHint).toContain('usernameFormatErrorHint');
   });
   it('sets isValid as true when `isFieldVisiblyInvalid` is false', function () {
     require('field/index').isFieldVisiblyInvalid = function () {
       return false;
     };
     var UsernamePane = getComponent();
-    (0, _testUtils.expectComponent)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps)).toMatchSnapshot();
+    var _render4 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps)),
+      container = _render4.container;
+    var props = (0, _testUtils.getMockProps)(container.querySelector('[data-__type="username_input"]'));
+    expect(props.isValid).toBe(true);
   });
   it('sets autoComplete to true when `allowAutocomplete` is true', function () {
     require('core/index').ui.allowAutocomplete = function () {
       return true;
     };
     var UsernamePane = getComponent();
-    (0, _testUtils.expectComponent)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps)).toMatchSnapshot();
+    var _render5 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps)),
+      container = _render5.container;
+    var props = (0, _testUtils.getMockProps)(container.querySelector('[data-__type="username_input"]'));
+    expect(props.autoComplete).toBe(true);
   });
   it('fetches the avatar on componentDidMount if ui.avatar is true and there is a username', function () {
     require('core/index').ui.avatar = function () {
       return true;
     };
     var UsernamePane = getComponent();
-    (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps));
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps));
     var mock = require('avatar').requestAvatar.mock;
     expect(mock.calls.length).toBe(1);
   });
@@ -147,8 +164,9 @@ describe('UsernamePane', function () {
       return true;
     };
     var UsernamePane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper);
+    var _render6 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps)),
+      container = _render6.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'username_input');
     props.onChange({
       target: {
         value: 'newUser'
@@ -159,8 +177,9 @@ describe('UsernamePane', function () {
   });
   it('calls `swap` onChange', function () {
     var UsernamePane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper);
+    var _render7 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(UsernamePane, defaultProps)),
+      container = _render7.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'username_input');
     props.onChange({
       target: {
         value: 'newUser'

package/lib/__tests__/field/vcode_pane.js

@@ -1,7 +1,7 @@
 "use strict";
 
 var _react = _interopRequireDefault(require("react"));
-var _enzyme = require("enzyme");
+var _react2 = require("@testing-library/react");
 var _testUtils = require("testUtils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
@@ -98,16 +98,20 @@ describe('VcodePane', function () {
   });
   it('calls `onRestart` when alternative link is clicked', function () {
     var VcodePane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(VcodePane, defaultProps));
-    wrapper.find('.auth0-lock-alternative-link').simulate('click');
+    var _render = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(VcodePane, defaultProps)),
+      container = _render.container;
+    (0, _react2.act)(function () {
+      container.querySelector('.auth0-lock-alternative-link').click();
+    });
     var mock = defaultProps.onRestart.mock;
     expect(mock.calls.length).toBe(1);
     expect(mock.calls[0]).toMatchSnapshot();
   });
   it('calls `swap` when VcodeInput changes', function () {
     var VcodePane = getComponent();
-    var wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(VcodePane, defaultProps));
-    var props = (0, _testUtils.extractPropsFromWrapper)(wrapper, 1);
+    var _render2 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(VcodePane, defaultProps)),
+      container = _render2.container;
+    var props = (0, _testUtils.extractPropsFromWrapper)(container, 'vcode_input');
     props.onChange({
       preventDefault: jest.fn(),
       target: {

package/lib/__tests__/setup-tests.js

@@ -1,14 +1,8 @@
 "use strict";
 
-var _enzyme = require("enzyme");
-var _enzymeAdapterReact = _interopRequireDefault(require("@cfaester/enzyme-adapter-react-18"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+require("@testing-library/jest-dom");
 // setup file
 
-(0, _enzyme.configure)({
-  adapter: new _enzymeAdapterReact.default()
-});
-
 //jest polyfills
 window.requestAnimationFrame = function (callback) {
   setTimeout(callback, 0);

package/lib/__tests__/testUtils.js

@@ -1,63 +1,49 @@
 "use strict";
 
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.setURL = exports.renderShallowComponent = exports.mockComponent = exports.extractPropsFromWrapper = exports.expectShallowComponent = exports.expectMockToMatch = exports.expectComponent = void 0;
+exports.setURL = exports.mockComponent = exports.getMockProps = exports.extractPropsFromWrapper = exports.expectMockToMatch = exports.expectComponent = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _reactTestRenderer = _interopRequireDefault(require("react-test-renderer"));
-var _shallow = _interopRequireDefault(require("react-test-renderer/shallow"));
-var _webpack = require("webpack");
+var _react2 = require("@testing-library/react");
 var _excluded = ["children"]; // eslint-disable-line
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
-var expectComponent = exports.expectComponent = function expectComponent(children, opts) {
-  var component = _reactTestRenderer.default.create(children, opts);
-  return expect(component);
+var expectComponent = exports.expectComponent = function expectComponent(children) {
+  var _render = (0, _react2.render)(children),
+    asFragment = _render.asFragment;
+  return expect(asFragment());
 };
-var expectShallowComponent = exports.expectShallowComponent = function expectShallowComponent(children) {
-  var component = renderShallowComponent(children);
-  return expect(component);
-};
-var renderShallowComponent = exports.renderShallowComponent = function renderShallowComponent(children) {
-  var renderer = new _shallow.default();
-  renderer.render(children);
-  return renderer.getRenderOutput();
-};
-var addDataToProps = function addDataToProps(props) {
-  var returnedProps = {};
-  Object.keys(props).forEach(function (k) {
-    return returnedProps["data-".concat(k)] = props[k];
-  });
-  return returnedProps;
-};
-var removeDataFromProps = function removeDataFromProps(props) {
-  var returnedProps = {};
-  Object.keys(props).forEach(function (k) {
-    return returnedProps[k.replace('data-', '')] = props[k];
-  });
-  return returnedProps;
+
+// WeakMap stores original props keyed by DOM element, populated by mockComponent via ref.
+// This replaces both the data-* attribute approach (which loses types in snapshots)
+// and the __reactProps$* fiber internals approach (which is an implementation detail).
+var _mockProps = new WeakMap();
+var getMockProps = exports.getMockProps = function getMockProps(el) {
+  return _mockProps.get(el) || {};
 };
 var mockComponent = exports.mockComponent = function mockComponent(type) {
   var domElement = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'div';
   return function (_ref) {
     var children = _ref.children,
       props = _objectWithoutProperties(_ref, _excluded);
-    return /*#__PURE__*/_react.default.createElement(domElement, _objectSpread({
-      'data-__type': type
-    }, addDataToProps(props)), children);
+    return /*#__PURE__*/_react.default.createElement(domElement, {
+      'data-__type': type,
+      ref: function ref(el) {
+        if (el) _mockProps.set(el, props);
+      }
+    }, children);
   };
 };
-var extractPropsFromWrapper = exports.extractPropsFromWrapper = function extractPropsFromWrapper(wrapper) {
-  var index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-  return removeDataFromProps(wrapper.find('div').at(index).props());
+
+// Lookup by mock component type name: extractPropsFromWrapper(container, 'input_wrap')
+// Lookup Nth of a type: extractPropsFromWrapper(container, 'auth_button', 1)
+var extractPropsFromWrapper = exports.extractPropsFromWrapper = function extractPropsFromWrapper(container, type) {
+  var nth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+  var el = container.querySelectorAll("[data-__type=\"".concat(type, "\"]"))[nth];
+  if (!el) return {};
+  return getMockProps(el);
 };
 
 // Newer (> Jest v22) versions don't allow modification of location.href
@@ -85,7 +71,6 @@ var setURL = exports.setURL = function setURL(url) {
       pathname: parsedUrl.pathname,
       search: parsedUrl.search,
       hash: parsedUrl.hash,
-      // Add toString for debugging
       toString: function toString() {
         return parsedUrl.href;
       }