diff --git a/test-old/Switch.test.tsx b/test-old/Switch.test.tsx
deleted file mode 100644
index bc1ce5a3..00000000
--- a/test-old/Switch.test.tsx
+++ /dev/null
@@ -1,202 +0,0 @@
-import { mount, shallow } from 'enzyme';
-import React from 'react';
-import { Case, Default, Switch } from '../src';
-
-describe(' component', () => {
- describe('Renders children ', () => {
- test('GIVEN multiple cases w/ truthy condition THEN renders children of first ', () => {
- const wrapped = shallow(
-
-
- Case1
-
-
- Case2
-
-
- );
-
- expect(wrapped).toMatchSnapshot();
- expect(wrapped.containsMatchingElement(Case1)).toBe(true);
- expect(wrapped.containsMatchingElement(Case2)).toBe(false);
- });
-
- test('GIVEN multiple cases w/ falsy condition then truthy condition THEN renders children of second ', () => {
- const wrapped = shallow(
-
-
- Case1
-
-
- Case2
-
-
- );
-
- expect(wrapped).toMatchSnapshot();
- expect(wrapped.containsMatchingElement(Case1)).toBe(false);
- expect(wrapped.containsMatchingElement(Case2)).toBe(true);
- });
-
- test('GIVEN multiple cases w/ falsy condition then function as truthy condition THEN renders children of second ', () => {
- const wrapped = shallow(
-
-
- Case1
-
- true}>
- Case2
-
-
- );
-
- expect(wrapped).toMatchSnapshot();
- expect(wrapped.containsMatchingElement(Case1)).toBe(false);
- expect(wrapped.containsMatchingElement(Case2)).toBe(true);
- });
-
- test('GIVEN condition as function THEN resolves for first ', () => {
- const wrapped = shallow(
-
- true}>
- Case1
-
- false}>
- Case2
-
- true}>
- Case3
-
-
- );
-
- expect(wrapped).toMatchSnapshot();
- expect(wrapped.containsMatchingElement(Case1)).toBe(true);
- expect(wrapped.containsMatchingElement(Case2)).toBe(false);
- expect(wrapped.containsMatchingElement(Case3)).toBe(false);
- });
-
- test('GIVEN child as function THEN resolves for first ', () => {
- const wrapped = mount(
-
- true}>{() => Case1}
- false}>
- Case2
-
- true}>
- Case3
-
-
- );
-
- expect(wrapped).toMatchSnapshot();
- expect(wrapped.containsMatchingElement(Case1)).toBe(true);
- expect(wrapped.containsMatchingElement(Case2)).toBe(false);
- expect(wrapped.containsMatchingElement(Case3)).toBe(false);
- });
- });
-
- describe('Renders the child element of ', () => {
- test('GIVEN simple THEN renders children of ', () => {
- const wrapped = shallow(
-
-
- Default
-
-
- );
-
- expect(wrapped).toMatchSnapshot();
- expect(wrapped.containsMatchingElement(Default)).toBe(true);
- });
-
- test('GIVEN falsy and THEN renders children of ', () => {
- const wrapped = shallow(
-
-
- Case
-
-
- Default
-
-
- );
-
- expect(wrapped).toMatchSnapshot();
- expect(wrapped.containsMatchingElement(Default)).toBe(true);
- expect(wrapped.containsMatchingElement(Case)).toBe(false);
- });
-
- test('GIVEN truthy and THEN renders children of ', () => {
- const wrapped = shallow(
-
-
- Case
-
-
- Default
-
-
- );
-
- expect(wrapped).toMatchSnapshot();
- expect(wrapped.containsMatchingElement(Case)).toBe(true);
- expect(wrapped.containsMatchingElement(Default)).toBe(false);
- });
-
- test('GIVEN children as function THEN renders children of ', () => {
- const wrapped = mount(
-
- {() => Case}
- {() => Default}
-
- );
-
- expect(wrapped).toMatchSnapshot();
- expect(wrapped.containsMatchingElement(Default)).toBe(true);
- expect(wrapped.containsMatchingElement(Case)).toBe(false);
- });
- });
-
- describe('Renders nothing in some cases', () => {
- test('GIVEN no children THEN renders nothing', () => {
- const wrapped = shallow();
-
- expect(wrapped).toMatchSnapshot();
- expect(wrapped.html()).toBeNull();
- });
-
- test('GIVEN multiple cases w/ all falsy condition THEN renders nothing', () => {
- const wrapped = shallow(
-
-
- Case1
-
-
- Case2
-
-
- );
-
- expect(wrapped).toMatchSnapshot();
- expect(wrapped.containsMatchingElement(Case1)).toBe(false);
- expect(wrapped.containsMatchingElement(Case2)).toBe(false);
- expect(wrapped.html()).toBeNull();
- });
-
- test('GIVEN invalid React children THEN does not render those', () => {
- const wrapped = shallow(
-
- {() => [{ key: 'one', prop: 'two' }]}
-
- Case2
-
-
- );
-
- expect(wrapped).toMatchSnapshot();
- expect(wrapped.containsMatchingElement(Case1)).toBe(false);
- expect(wrapped.containsMatchingElement(Case2)).toBe(true);
- });
- });
-});
diff --git a/test/Switch.test.tsx b/test/Switch.test.tsx
new file mode 100644
index 00000000..1dc67434
--- /dev/null
+++ b/test/Switch.test.tsx
@@ -0,0 +1,183 @@
+import { render, screen } from '@testing-library/react';
+import React from 'react';
+import { Case, Default, Switch } from '../src';
+
+describe(' component', () => {
+ describe('Renders children ', () => {
+ test('GIVEN multiple cases w/ truthy condition THEN renders children of first ', () => {
+ render(
+
+
+ Case1
+
+
+ Case2
+
+
+ );
+
+ expect(screen.queryByTestId('case1')).toContainHTML('Case1');
+ expect(screen.queryByTestId('case2')).toBeNull();
+ });
+
+ test('GIVEN multiple cases w/ falsy condition then truthy condition THEN renders children of second ', () => {
+ render(
+
+
+ Case1
+
+
+ Case2
+
+
+ );
+
+ expect(screen.queryByTestId('case1')).toBeNull();
+ expect(screen.queryByTestId('case2')).toContainHTML('Case2');
+ });
+
+ test('GIVEN multiple cases w/ falsy condition then function as truthy condition THEN renders children of second ', () => {
+ render(
+
+
+ Case1
+
+ true}>
+ Case2
+
+
+ );
+
+ expect(screen.queryByTestId('case1')).toBeNull();
+ expect(screen.queryByTestId('case2')).toContainHTML('Case2');
+ });
+
+ test('GIVEN condition as function THEN resolves for first ', () => {
+ render(
+
+ true}>
+ Case1
+
+ false}>
+ Case2
+
+ true}>
+ Case3
+
+
+ );
+
+ expect(screen.queryByTestId('case1')).toContainHTML('Case1');
+ expect(screen.queryByTestId('case2')).toBeNull();
+ expect(screen.queryByTestId('case-3')).toBeNull();
+ });
+
+ test('GIVEN child as function THEN resolves for first ', () => {
+ render(
+
+ true}>{() => Case1}
+ false}>
+ Case2
+
+ true}>
+ Case3
+
+
+ );
+
+ expect(screen.queryByTestId('case1')).toContainHTML('Case1');
+ expect(screen.queryByTestId('case2')).toBeNull();
+ expect(screen.queryByTestId('case-3')).toBeNull();
+ });
+ });
+
+ describe('Renders the child element of ', () => {
+ test('GIVEN simple THEN renders children of ', () => {
+ render(
+
+
+ Default
+
+
+ );
+
+ expect(screen.queryByTestId('default')).toContainHTML('Default');
+ });
+
+ test('GIVEN falsy and THEN renders children of ', () => {
+ render(
+
+
+ Case
+
+
+ Default
+
+
+ );
+
+ expect(screen.queryByTestId('case1')).toBeNull();
+ expect(screen.queryByTestId('default')).toContainHTML('Default');
+ });
+
+ test('GIVEN truthy and THEN renders children of ', () => {
+ render(
+
+
+ Case
+
+
+ Default
+
+
+ );
+
+ expect(screen.queryByTestId('case1')).toContainHTML('Case');
+ expect(screen.queryByTestId('default')).toBeNull();
+ });
+
+ test('GIVEN children as function THEN renders children of ', () => {
+ render(
+
+ {() => Case}
+ {() => Default}
+
+ );
+
+ expect(screen.queryByTestId('case1')).toBeNull();
+ expect(screen.queryByTestId('default')).toContainHTML('Default');
+ });
+ });
+
+ describe('Renders nothing in some cases', () => {
+ test('GIVEN multiple cases w/ all falsy condition THEN renders nothing', () => {
+ render(
+
+
+ Case1
+
+
+ Case2
+
+
+ );
+
+ expect(screen.queryByTestId('case1')).toBeNull();
+ expect(screen.queryByTestId('case2')).toBeNull();
+ });
+
+ test('GIVEN invalid React children THEN does not render those', () => {
+ render(
+ // @ts-expect-error invalid JSX
+
+ {() => [{ key: 'one', prop: 'two' }]}
+
+ Case2
+
+
+ );
+
+ expect(screen.queryByTestId('case2')).toContainHTML('Case2');
+ });
+ });
+});