如何通过玩笑来测试getDerivedStateFromProps

Question

我看过How to test getDerivedStateFromProps with Jest and Enzyme，但它对我不起作用。这是我的测试

it('should be red processing only, routing, security grey while bg tasks are running', () => {
        component = mount(
            <ProcessingStatus store={store}/>
        );
        const instance = component.instance();
        //console.log(instance)
        component.setProps({ processing_status: {
                header:{
                    error: true,
                    message: 'This comms matrix is currently processing flows',
                    statusCode: 200
                },
                body: {}
            } });

        console.log(component.state())
console.log(component.props())
        expect(component.find(TrafficLight).length).toEqual(3);
        expect(component.find(TrafficLight).at(0).props().RedOn).toEqual(true);
        expect(component.find(TrafficLight).at(0).props().AmberOn).toEqual(false);
        expect(component.find(TrafficLight).at(0).props().GreenOn).toEqual(false);
    });

[component.state()或instance.state始终为空{}。

这是component.props()的内容

{ store:
       { getState: [Function: getState],
         getActions: [Function: getActions],
         dispatch:
          { [Function: mockConstructor]
            _isMockFunction: true,
            getMockImplementation: [Function],
            mock: [Getter/Setter],
            mockClear: [Function],
            mockReset: [Function],
            mockRestore: [Function],
            mockReturnValueOnce: [Function],
            mockResolvedValueOnce: [Function],
            mockRejectedValueOnce: [Function],
            mockReturnValue: [Function],
            mockResolvedValue: [Function],
            mockRejectedValue: [Function],
            mockImplementationOnce: [Function],
            mockImplementation: [Function],
            mockReturnThis: [Function],
            mockName: [Function],
            getMockName: [Function] },
         clearActions: [Function: clearActions],
         subscribe: [Function: subscribe],
         replaceReducer: [Function: replaceReducer] },
      processing_status:
       { header:
          { error: true,
            message: 'This comms matrix is currently processing flows',
            statusCode: 200 },
         body: {} } }

我需要触发此操作，因为取决于我的道具值，状态会改变并呈现其他条件。

Answer 1

如果它是连接的组件，则需要以其他方式检索它。

component = mount(
            <ProcessingStatus store={store}/>
        );
        const instance = component.find('ProcessingStatus').instance();
        component.setProps({ processing_status: {
                header:{
                    error: true,
                    message: 'This comms matrix is currently processing flows',
                    statusCode: 200
                },
                body: {}
            } });

        console.log(instance.state);

为我提供了

 console.log tests/jest/components/common/ProcessingStatus/index.test.js:122
    { nextStep: 'This comms matrix is currently processing flows' }

以前的答案中不清楚的是是否存在connected，并且是否正在使用shallow或mount