Context Thief

Helper function to steal React context values for testing

Description

Context Thief stores the current context value for the inputted context for use in tests.

If you test components with contexts and don't want to create a new function or component every time, this module is for you!

Installation

npm install --save-dev context-thief

Usage

createContextThief(context)

Returns: {ContextThief, contextValue} Object containing the component to render and the outputted value

| Parameter | Type | Description | | --------- | --------- | -------------------------------------- | | context | Context | Instance of React.Context to consume |

Example

example-component.tsx

import React from "react";

export const ExampleContext = React.createContext(false);
export const ExampleComponent: React.FC<{children: React.ReactNode}> = ({children}) => {
    return (
        <TestContext.Provider value={true}>
            {children}
        </TestContext.Provider>
    );
};

example-component.test.tsx

import React from "react";
import {render} from "@testing-library/react";
import {createContextThief} from "context-thief";
import {ExampleContext, ExampleComponent} from "./example-component";

it("should have the default current context value", () => {
    const {ContextThief, contextValue} = createContextThief(ExampleContext);

    render(
        <ExampleComponent>
            <ContextThief />
        </ExampleComponent>
    );

    expect(contextValue.current).toBe(true);
});

License

Copyright Evelyn Hathaway, MIT License

Icon Glyph

Icon glyph made by Gregor Cresnar