Why is my react unit test import not working?

Question

The navList.js is correct when I run npm run watch.

But when I try to run npm test, the log only shows setArticleGroup: 1 ( setArticleGroup: 2 and setArticleGroup: 3 are missing ).

I realize that getArticlesFromDatabase is not work in test, why is this the case?

navList.test.js

it('function setArticleGroup() ', function () {
    let app = shallow(<NavList sieve="info" />);
});

navList.js

import {getArticlesFromDatabase} from '../csrfData';

setArticleGroup(){
    let that = this;
    console.log('setArticleGroup: 1   ');

    getArticlesFromDatabase.then(function(value) {
        console.log('setArticleGroup: 2   ');

        ...//skip

        that.setState({'articleGroup':articleGroup},()=>{
            console.log('setArticleGroup: 3   ',articleGroup);
        });
    });
}

csrfData.js

var getArticlesFromDatabase = new Promise(function(resolve, reject) {
    let articles;
    axios.get('../api/articles/get-articles-list').then(response=>{
        articles = response.data.list;
        resolve(articles);
    }).catch(function (error) {
        console.log(error);
    });
});

export {getArticlesFromDatabase,testCsrfData};

score 1 · Accepted Answer · answered Feb 02 '18 at 09:22

1

Unless getArticlesFromDatabase is an object with a then function as property, I'd say you should be calling it like this (note the parens):

getArticlesFromDatabase().then(function(value) {

answered Feb 02 '18 at 09:22

Miguel Calderón

3,001
1
16
18

what do you mean? If I change getArticlesFromDatabase.then(function(value) {}) to getArticlesFromDatabase().then(function(value) {}), it will get error. – jimmy Feb 02 '18 at 09:30
I thought that `getArticlesFromDatabase` would be a promise returning function, since `then` was appended to it. I can't figure out more without seeing the code imported from `csrfData`. – Miguel Calderón Feb 02 '18 at 09:50
Hello, sorry for reply so late. I already add csrfData.js, plz help. – jimmy Feb 05 '18 at 07:47
Sorry, you're right. I don't know how you've configured axios to handle HTTP errors, but in case they're not throwing an error maybe you can check what status code is being returned in the .then function: `console.log(response.status)`. – Miguel Calderón Feb 05 '18 at 08:55
1

Thanks for advice, you are right that issue is come from catch. So I new a qusetion which I think is the main problem. Thanks for help. https://stackoverflow.com/questions/48658252/unit-test-how-to-mock-axios-in-react – jimmy Feb 07 '18 at 07:35

Why is my react unit test import not working?

1 Answers1