React Apollo. Как замокать стейт компонента в тестах используя MockedProvider?

Есть два компонента Devices и DevicesCard.

<Devices>
    <DevicesCard></DevicesCard>
</Devices>

Оба они используют Apollo Хуки

Devices - использует useQuery() для запроса данных.

DevicesCard - использует useSubscription() для обновления данных в реальном времени.

Компонент DevicesCard меняет стейт в компоненте Devices через callback.

const Devices = () => {
   const [count, changeCount] = useState(0);
   <Devices>
       <p>{count}</p>
       <DevicesCard changeState={changeCount} />
   </Devices>
}

const DevicesCard = ({ changeState }) => {
    <DevicesCard>
        <Button onClick={() => changeState({ count: 1 })}>
    </DevicesCard>
}

Hачинаю тестировать Devices. Нужно проверить, что после нажатия на кнопку в DevicesCard, обновляется стейт в Devices

<MockedProvider>
    <Devices />
</MockedProvider>

В тестах получаю ошибку No more mocked responses for the query: subscription

Мол, "замокайте useSubscription() в дочернем компоненте"

Почему-то MockedProvider не мокирует дочерние компоненты

Хорошо, мокаю

jest.mock('./DeviceCard', () => props => 'DeviceCard');

Теперь DeviceCard возвращает просто текст => DeviceCard и уже мы не можем кликнуть по кнопке, чтобы поменять стейт.

Вопрос: Как поменять стейт без клика по кнопке?

Если бы можно было использовать shallow метод вместе с MockedProvider, то тут просто

wrapper.setState({ count: 1 });

Ответы (0 шт):