Testing NGXS states with sub states feeds wrong state into action handler












1















Setup:



I have a parent state defined as



@State<ParentStateModel>({
name: 'grid',
defaults: {
parentData: 'some data'
},
children: [LoadingState]
})
export class ParentState {
@Action(Action1)
action1(ctx: stateContext<ParentStateModel>, action: Action1) {
// In production this state will be ParentStateModel as expected
// but in unit test, it will be of type LoadingState
const state = ctx.getState();
}
}


And a child state defined as



@State<LoadingStateModel>({
name: 'gridLoading',
defaults: {
loading: false
}
})
export class LoadingState{
@Action(Action1)
action1(ctx: stateContext<LoadingStateModel>, action: Action1) {
ctx.setState({loading: true});
}
}


Notice that both states respond to Action1.



When running this in production, it works as it should. The loading state takes care of the LoadingStateModel and the ParentState takes care of the ParentStateModel.



But when unit testing the code, the action handler in ParentState is fed the LoadingStateModel instead of the ParentStateModel (see comment in code).



My unit test is setup as follows



TestBed.configureTestingModule({
imports: [NgxsModule.forRoot([CashflowState, LoadingState])]
});


If I do not include LoadingState in the imports array, NGXS fails with Child state not found: function LoadingState()



Am I doing something wrong, or is it a bug in NGXS?










share|improve this question























  • A simple basic question: are the imports for Action1 correctly set?

    – GCSDC
    Dec 6 '18 at 21:34
















1















Setup:



I have a parent state defined as



@State<ParentStateModel>({
name: 'grid',
defaults: {
parentData: 'some data'
},
children: [LoadingState]
})
export class ParentState {
@Action(Action1)
action1(ctx: stateContext<ParentStateModel>, action: Action1) {
// In production this state will be ParentStateModel as expected
// but in unit test, it will be of type LoadingState
const state = ctx.getState();
}
}


And a child state defined as



@State<LoadingStateModel>({
name: 'gridLoading',
defaults: {
loading: false
}
})
export class LoadingState{
@Action(Action1)
action1(ctx: stateContext<LoadingStateModel>, action: Action1) {
ctx.setState({loading: true});
}
}


Notice that both states respond to Action1.



When running this in production, it works as it should. The loading state takes care of the LoadingStateModel and the ParentState takes care of the ParentStateModel.



But when unit testing the code, the action handler in ParentState is fed the LoadingStateModel instead of the ParentStateModel (see comment in code).



My unit test is setup as follows



TestBed.configureTestingModule({
imports: [NgxsModule.forRoot([CashflowState, LoadingState])]
});


If I do not include LoadingState in the imports array, NGXS fails with Child state not found: function LoadingState()



Am I doing something wrong, or is it a bug in NGXS?










share|improve this question























  • A simple basic question: are the imports for Action1 correctly set?

    – GCSDC
    Dec 6 '18 at 21:34














1












1








1


1






Setup:



I have a parent state defined as



@State<ParentStateModel>({
name: 'grid',
defaults: {
parentData: 'some data'
},
children: [LoadingState]
})
export class ParentState {
@Action(Action1)
action1(ctx: stateContext<ParentStateModel>, action: Action1) {
// In production this state will be ParentStateModel as expected
// but in unit test, it will be of type LoadingState
const state = ctx.getState();
}
}


And a child state defined as



@State<LoadingStateModel>({
name: 'gridLoading',
defaults: {
loading: false
}
})
export class LoadingState{
@Action(Action1)
action1(ctx: stateContext<LoadingStateModel>, action: Action1) {
ctx.setState({loading: true});
}
}


Notice that both states respond to Action1.



When running this in production, it works as it should. The loading state takes care of the LoadingStateModel and the ParentState takes care of the ParentStateModel.



But when unit testing the code, the action handler in ParentState is fed the LoadingStateModel instead of the ParentStateModel (see comment in code).



My unit test is setup as follows



TestBed.configureTestingModule({
imports: [NgxsModule.forRoot([CashflowState, LoadingState])]
});


If I do not include LoadingState in the imports array, NGXS fails with Child state not found: function LoadingState()



Am I doing something wrong, or is it a bug in NGXS?










share|improve this question














Setup:



I have a parent state defined as



@State<ParentStateModel>({
name: 'grid',
defaults: {
parentData: 'some data'
},
children: [LoadingState]
})
export class ParentState {
@Action(Action1)
action1(ctx: stateContext<ParentStateModel>, action: Action1) {
// In production this state will be ParentStateModel as expected
// but in unit test, it will be of type LoadingState
const state = ctx.getState();
}
}


And a child state defined as



@State<LoadingStateModel>({
name: 'gridLoading',
defaults: {
loading: false
}
})
export class LoadingState{
@Action(Action1)
action1(ctx: stateContext<LoadingStateModel>, action: Action1) {
ctx.setState({loading: true});
}
}


Notice that both states respond to Action1.



When running this in production, it works as it should. The loading state takes care of the LoadingStateModel and the ParentState takes care of the ParentStateModel.



But when unit testing the code, the action handler in ParentState is fed the LoadingStateModel instead of the ParentStateModel (see comment in code).



My unit test is setup as follows



TestBed.configureTestingModule({
imports: [NgxsModule.forRoot([CashflowState, LoadingState])]
});


If I do not include LoadingState in the imports array, NGXS fails with Child state not found: function LoadingState()



Am I doing something wrong, or is it a bug in NGXS?







ngxs






share|improve this question













share|improve this question











share|improve this question




share|improve this question










asked Nov 21 '18 at 11:58









rasmusvhansenrasmusvhansen

8571911




8571911













  • A simple basic question: are the imports for Action1 correctly set?

    – GCSDC
    Dec 6 '18 at 21:34



















  • A simple basic question: are the imports for Action1 correctly set?

    – GCSDC
    Dec 6 '18 at 21:34

















A simple basic question: are the imports for Action1 correctly set?

– GCSDC
Dec 6 '18 at 21:34





A simple basic question: are the imports for Action1 correctly set?

– GCSDC
Dec 6 '18 at 21:34












0






active

oldest

votes











Your Answer






StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});














draft saved

draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53411562%2ftesting-ngxs-states-with-sub-states-feeds-wrong-state-into-action-handler%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown

























0






active

oldest

votes








0






active

oldest

votes









active

oldest

votes






active

oldest

votes
















draft saved

draft discarded




















































Thanks for contributing an answer to Stack Overflow!


  • Please be sure to answer the question. Provide details and share your research!

But avoid



  • Asking for help, clarification, or responding to other answers.

  • Making statements based on opinion; back them up with references or personal experience.


To learn more, see our tips on writing great answers.




draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53411562%2ftesting-ngxs-states-with-sub-states-feeds-wrong-state-into-action-handler%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







Popular posts from this blog

mysqli_query(): Empty query in /home/lucindabrummitt/public_html/blog/wp-includes/wp-db.php on line 1924

How to change which sound is reproduced for terminal bell?

Can I use Tabulator js library in my java Spring + Thymeleaf project?