diff --git a/packages/enzyme-test-suite/test/shared/hooks/useContext.jsx b/packages/enzyme-test-suite/test/shared/hooks/useContext.jsx index 14b41001f..e3ee0caac 100644 --- a/packages/enzyme-test-suite/test/shared/hooks/useContext.jsx +++ b/packages/enzyme-test-suite/test/shared/hooks/useContext.jsx @@ -18,42 +18,40 @@ export default function describeUseContext({ isShallow, }) { describeIf(hasHooks, 'hooks: useContext', () => { - describe('simple example', () => { - const initialTitle = 'initialTitle'; - const TitleContext = createContext(initialTitle); + const initialTitle = 'initialTitle'; + const TitleContext = createContext(initialTitle); - const UiComponent = () => { - const title = useContext(TitleContext); - return ( -
- {title} -
- ); - }; + const UiComponent = () => { + const title = useContext(TitleContext); + return ( +
+ {title} +
+ ); + }; - const customTitle = 'CustomTitle'; + const customTitle = 'CustomTitle'; - const App = () => ( - - - - ); + const App = () => ( + + + + ); - it('render ui component with initial context value', () => { - const wrapper = Wrap(); - expect(wrapper.text()).to.equal(initialTitle); - }); - - // TODO: useContext: enable when shallow dive supports createContext - itIf(!isShallow, 'render ui component with value from outer provider', () => { - const wrapper = Wrap(); - const subWrapper = isShallow ? wrapper.dive().dive() : wrapper; - expect(subWrapper.text()).to.equal(customTitle); - }); + it('render ui component with initial context value', () => { + const wrapper = Wrap(); + expect(wrapper.text()).to.equal(initialTitle); + }); + + // TODO: useContext: enable when shallow dive supports createContext + itIf(!isShallow, 'render ui component with value from outer provider', () => { + const wrapper = Wrap(); + const subWrapper = isShallow ? wrapper.dive().dive() : wrapper; + expect(subWrapper.text()).to.equal(customTitle); }); // TODO: useContext: enable when shallow dive supports createContext - describeIf(!isShallow, 'useContext: with Setting', () => { + itIf(!isShallow, 'useContext: test render, get and set context value', () => { const initialState = 10; const context = createContext(null); @@ -80,7 +78,7 @@ export default function describeUseContext({ ); - const App = () => { + const Parent = () => { const [state, setState] = useState(initialState); return ( @@ -92,27 +90,25 @@ export default function describeUseContext({ ); }; - it('test render, get and set context value ', () => { - const wrapper = Wrap(); - - function getChild() { - const child = wrapper.find(MyChild); - return isShallow ? child.dive() : child; - } - function getGrandChild() { - const grandchild = getChild().find(MyGrandChild); - return isShallow ? grandchild.dive() : grandchild; - } - expect(getGrandChild().find('.grandChildState').debug()).to.equal(` + const wrapper = Wrap(); + + function getChild() { + const child = wrapper.find(MyChild); + return isShallow ? child.dive() : child; + } + function getGrandChild() { + const grandchild = getChild().find(MyGrandChild); + return isShallow ? grandchild.dive() : grandchild; + } + expect(getGrandChild().find('.grandChildState').debug()).to.equal(` ${String(initialState)} `); - getGrandChild().find('button').props().onClick(); - wrapper.update(); - expect(getGrandChild().find('.grandChildState').debug()).to.equal(` + getGrandChild().find('button').props().onClick(); + wrapper.update(); + expect(getGrandChild().find('.grandChildState').debug()).to.equal(` ${String(initialState + 1)} `); - }); }); }); }