jest + enzyme, using mount(), document.getElementById() returns null on component which appear after _method call

Found the solution thanks to https://stackoverflow.com/users/853560/lewis-chung and gods of Google:

  1. Attached my component to DOM via attachTo param:

    const result = mount(
        <App />, { attachTo: document.body }
    );
    
  2. Changed buggy string in my method to string which works with element Object

agentToMod.location = locationSelect.options[locationSelect.selectedIndex].text;` : 

_modifyAgentStatus () {

    const { currentAgentProfile, agentsDatabase } = this.state;
    const agentToMod = currentAgentProfile;

    if (agentToMod.status === 'Free') {
        this.setState({
            infoDisplayContent: 'mission'
        });
        agentToMod.status="Waiting";
    } else if (agentToMod.status === 'Waiting') {
        const locationSelect = document.getElementById('missionLocationSelect');

        agentToMod.location = agentToMod.location = locationSelect.options[locationSelect.selectedIndex].text;
        agentToMod.status="On Mission";
        this.setState({
            infoDisplayContent: 'profile'
            });
        }
    }

Leave a Comment