context-thief

Helper function to steal React context values for testing

Usage no npm install needed!

<script type="module">
  import contextThief from 'https://cdn.skypack.dev/context-thief';
</script>

README

Context Thief icon

Context Thief

Helper function to steal React context values for testing

npm version check status license: MIT

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

export const ExampleContext = React.createContext(false);
export const ExampleComponent: React.FC = ({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