Update to use createTestInstance

magento · May 10, 2019 · 4377db3 · 4377db3
1 parent acfc914
commit 4377db3
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 26 deletions.
diff --git a/packages/venia-concept/src/components/ProductFullDetail/__tests__/ProductFullDetail.spec.js b/packages/venia-concept/src/components/ProductFullDetail/__tests__/ProductFullDetail.spec.js
@@ -1,7 +1,9 @@
 import React from 'react';
-import TestRenderer from 'react-test-renderer';
 import ProductFullDetail from '../ProductFullDetail';
-import { WindowSizeContextProvider } from '@magento/peregrine';
+import {
+    WindowSizeContextProvider,
+    createTestInstance
+} from '@magento/peregrine';
 
 jest.mock('src/classify');
 
@@ -82,7 +84,7 @@ const mockConfigurableProduct = {
 };
 
 test('Configurable Product has correct media gallery image count', async () => {
-    const { root } = TestRenderer.create(
+    const { root } = createTestInstance(
         <WindowSizeContextProvider>
             <ProductFullDetail
                 product={mockConfigurableProduct}

diff --git a/packages/venia-concept/src/components/ProductImageCarousel/__tests__/carousel.spec.js b/packages/venia-concept/src/components/ProductImageCarousel/__tests__/carousel.spec.js
@@ -1,8 +1,10 @@
 import React from 'react';
-import testRenderer from 'react-test-renderer';
 import { transparentPlaceholder } from 'src/shared/images';
 import Carousel from '../carousel';
-import { WindowSizeContextProvider } from '@magento/peregrine';
+import {
+    WindowSizeContextProvider,
+    createTestInstance
+} from '@magento/peregrine';
 
 jest.mock('src/classify');
 
@@ -42,7 +44,7 @@ const defaultProps = {
 };
 
 test('renders the Carousel component correctly w/ sorted images', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <Carousel {...defaultProps} />
         </WindowSizeContextProvider>
@@ -60,7 +62,7 @@ test('renders the Carousel component correctly w/ sorted images', () => {
 });
 
 test('renders active item as main image', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <Carousel {...defaultProps} />
         </WindowSizeContextProvider>
@@ -79,7 +81,7 @@ test('renders active item as main image', () => {
 });
 
 test('updates main image when non-active item is clicked', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <Carousel {...defaultProps} />
         </WindowSizeContextProvider>
@@ -103,7 +105,7 @@ test('updates main image when non-active item is clicked', () => {
 });
 
 test('renders prior image when left chevron is clicked', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <Carousel {...defaultProps} />
         </WindowSizeContextProvider>
@@ -128,7 +130,7 @@ test('renders prior image when left chevron is clicked', () => {
 });
 
 test('renders last image when left chevron is clicked and first item is active', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <Carousel {...defaultProps} />
         </WindowSizeContextProvider>
@@ -148,7 +150,7 @@ test('renders last image when left chevron is clicked and first item is active',
 });
 
 test('renders next image when right chevron is clicked', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <Carousel {...defaultProps} />
         </WindowSizeContextProvider>
@@ -168,7 +170,7 @@ test('renders next image when right chevron is clicked', () => {
 });
 
 test('renders first image when right chevron is clicked and last item is active', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <Carousel {...defaultProps} />
         </WindowSizeContextProvider>
@@ -193,12 +195,12 @@ test('renders first image when right chevron is clicked and last item is active'
 });
 
 test('renders a transparent main image if no file name is provided', () => {
-    const component = testRenderer.create(<Carousel images={[]} />);
+    const component = createTestInstance(<Carousel images={[]} />);
     expect(component.toJSON()).toMatchSnapshot();
 });
 
 test('sets main image alt as "image-product" if no label is provided', () => {
-    const component = testRenderer.create(<Carousel images={[]} />);
+    const component = createTestInstance(<Carousel images={[]} />);
 
     const activeImage = component.root.findAllByProps({
         className: 'currentImage'
@@ -209,7 +211,7 @@ test('sets main image alt as "image-product" if no label is provided', () => {
 });
 
 test('renders a placeholder until image is loaded', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <Carousel {...defaultProps} />
         </WindowSizeContextProvider>

diff --git a/packages/venia-concept/src/components/ProductImageCarousel/__tests__/thumbnail.spec.js b/packages/venia-concept/src/components/ProductImageCarousel/__tests__/thumbnail.spec.js
@@ -1,6 +1,8 @@
 import React from 'react';
-import testRenderer from 'react-test-renderer';
-import { WindowSizeContextProvider } from '@magento/peregrine';
+import {
+    WindowSizeContextProvider,
+    createTestInstance
+} from '@magento/peregrine';
 import Thumbnail from '../thumbnail';
 
 jest.mock('src/classify');
@@ -18,7 +20,7 @@ const defaultProps = {
 };
 
 test('renders the Thumbnail component correctly', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <Thumbnail {...defaultProps} />
         </WindowSizeContextProvider>
@@ -28,7 +30,7 @@ test('renders the Thumbnail component correctly', () => {
 });
 
 test('clicking calls click handler with item index', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <Thumbnail {...defaultProps} />
         </WindowSizeContextProvider>
@@ -49,7 +51,7 @@ test('renders transparent placeholder when no file name is provided', () => {
             label: 'placeholder-thumbnail'
         }
     };
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <Thumbnail {...props} />
         </WindowSizeContextProvider>
@@ -63,7 +65,7 @@ test('renders root class if not the active Thumbnail', () => {
         ...defaultProps,
         isActive: false
     };
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <Thumbnail {...props} />
         </WindowSizeContextProvider>

diff --git a/packages/venia-concept/src/components/ProductImageCarousel/__tests__/thumbnailList.spec.js b/packages/venia-concept/src/components/ProductImageCarousel/__tests__/thumbnailList.spec.js
@@ -1,8 +1,10 @@
 import React from 'react';
-import testRenderer from 'react-test-renderer';
 
 import ThumbnailList from '../thumbnailList';
-import { WindowSizeContextProvider } from '@magento/peregrine';
+import {
+    WindowSizeContextProvider,
+    createTestInstance
+} from '@magento/peregrine';
 jest.mock('src/classify');
 
 const updateActiveItemIndexMock = jest.fn();
@@ -22,7 +24,7 @@ const defaultProps = {
 };
 
 test('renders the ThumbnailList component correctly', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <ThumbnailList {...defaultProps} />
         </WindowSizeContextProvider>
@@ -32,7 +34,7 @@ test('renders the ThumbnailList component correctly', () => {
 });
 
 test('sets isActive on active thumbnail based on activeItemIndex', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <ThumbnailList {...defaultProps} />
         </WindowSizeContextProvider>
@@ -44,7 +46,7 @@ test('sets isActive on active thumbnail based on activeItemIndex', () => {
 });
 
 test('calls updateActiveItemIndex with index of clicked thumbnail', () => {
-    const component = testRenderer.create(
+    const component = createTestInstance(
         <WindowSizeContextProvider>
             <ThumbnailList {...defaultProps} />
         </WindowSizeContextProvider>