Add tests with dynamic context

enzymejs · Mar 20, 2022 · 5e1ca3c · 5e1ca3c
1 parent eb5c76e
commit 5e1ca3c
Showing 1 changed file with 41 additions and 11 deletions.
diff --git a/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx b/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx
@@ -673,17 +673,18 @@ describe('shallow', () => {
 
         class OuterComponent extends React.Component {
           render() {
+            const { value } = this.props;
             return (
-              <Provider value="foo"><InnerComponent /></Provider>
+              <Provider value={value}><InnerComponent /></Provider>
             );
           }
         }
 
         class WrappingComponent extends React.Component {
           render() {
-            const { children } = this.props;
+            const { children, value } = this.props;
             return (
-              <Provider value="foo">{ children }</Provider>
+              <Provider value={value}>{ children }</Provider>
             );
           }
         }
@@ -696,16 +697,45 @@ describe('shallow', () => {
 
         InnerComponent.contextType = Provider;
 
-        it('works on a Provider', () => {
-          const wrapper = shallow(<OuterComponent />);
-          const provides = wrapper.find(Provider).shallow();
-          const provider = provides.find(InnerComponent).shallow();
-          expect(provider.text()).to.equal('foo');
+        describe('rendering the Provider directly', () => {
+          it('renders initial context value', () => {
+            const wrapper = shallow(<OuterComponent value="foo" />);
+            const provides = wrapper.find(Provider).shallow();
+            const provider = provides.find(InnerComponent).shallow();
+
+            expect(provider.text()).to.equal('foo');
+          });
+
+          it('renders updated context value', () => {
+            const wrapper = shallow(<OuterComponent value="foo" />);
+            wrapper.setProps({ value: 'bar' });
+            const provides = wrapper.find(Provider).shallow();
+            const provider = provides.find(InnerComponent).shallow();
+
+            expect(provider.text()).to.equal('bar');
+          });
         });
 
-        it('works with wrappingComponent', () => {
-          const wrapper = shallow(<InnerComponent />, { wrappingComponent: WrappingComponent });
-          expect(wrapper.text()).to.equal('foo');
+        describe('rendereing the Provider through wrappingComponent', () => {
+          it('renders initial context value', () => {
+            const wrapper = shallow(<InnerComponent />, {
+              wrappingComponent: WrappingComponent,
+              wrappingComponentProps: { value: 'foo' },
+            });
+
+            expect(wrapper.text()).to.equal('foo');
+          });
+
+          it('renders updated context value', () => {
+            const wrapper = shallow(<InnerComponent />, {
+              wrappingComponent: WrappingComponent,
+              wrappingComponentProps: { value: 'foo' },
+            });
+            const wrappingComponent = wrapper.getWrappingComponent();
+            wrappingComponent.setProps({ value: 'bar' });
+            wrapper.update();
+            expect(wrapper.text()).to.equal('bar');
+          });
         });
       });
     });