Modify global Window Variable in Angular 6 Tests
I'm trying to test an end-to-end process in an Angular 6 app using e2e and protractor. I have a service that injects some javaScript into the page, so my tests verify that the script has been appended to the DOM.
The wrinkle is that the service checks a configuration object that is hard-coded in the index.html file. I have to set one particular property to false in order for my tests to run, but so far, I haven't managed to find a way to hook into the app initialization process.
I can get at the property using code such as this:
browser.wait(
browser.executeScript('return window.Config.local;')
.then(promise => expect(promise).toBe(false)
), 5000);
But the question is where to put the call!
I have put some time into using APP_INITIALIZER, but the only way that I could get it to work was by setting it in the app.module.ts file. I'd rather not change its contents for test purposes.
I would be most appreciative if anyone had any idea how to get at the window object before the app fully initializes. I have spent three full days on this now and still no solution...
Thanks!
angular testing protractor initialization e2e-testing asked Nov 15 '18 at 19:42
Rob GravelleRob Gravelle
176112
|
show 2 more comments
I'm trying to test an end-to-end process in an Angular 6 app using e2e and protractor. I have a service that injects some javaScript into the page, so my tests verify that the script has been appended to the DOM.
The wrinkle is that the service checks a configuration object that is hard-coded in the index.html file. I have to set one particular property to false in order for my tests to run, but so far, I haven't managed to find a way to hook into the app initialization process.
I can get at the property using code such as this:
browser.wait(
browser.executeScript('return window.Config.local;')
.then(promise => expect(promise).toBe(false)
), 5000);
But the question is where to put the call!
I have put some time into using APP_INITIALIZER, but the only way that I could get it to work was by setting it in the app.module.ts file. I'd rather not change its contents for test purposes.
I would be most appreciative if anyone had any idea how to get at the window object before the app fully initializes. I have spent three full days on this now and still no solution...
Thanks!
angular testing protractor initialization e2e-testing asked Nov 15 '18 at 19:42
Rob GravelleRob Gravelle
176112
Can you not conditionally use the APP_INITIALIZER in app module based on an environment key? Yes, it would be in your code base, but it will only run with a test flag set. Also, APP INIT doesn’t have to be in your app module, it could also live in a feature module which you could also exclude on a prod build.
– MikeOne
Nov 15 '18 at 20:21
I created a component called TestsInitializerModule. I don't suppose there's a way to dynamically load my module without including it in app.module.ts imports?
– Rob Gravelle
Nov 15 '18 at 20:49
No, probably not. However, you could dynamically import it inside your module import definitions so it will only be imported when runnig your test.
– MikeOne
Nov 15 '18 at 21:06
Again, what is your question?
– Oleksii
Nov 15 '18 at 21:29
Dynamically importing the module is a lot of work for a test! Unless someone comes up with a brilliant idea, I think that using a feature module is going to be the solution. :-)
– Rob Gravelle
Nov 15 '18 at 21:48
|
show 2 more comments
I'm trying to test an end-to-end process in an Angular 6 app using e2e and protractor. I have a service that injects some javaScript into the page, so my tests verify that the script has been appended to the DOM.
The wrinkle is that the service checks a configuration object that is hard-coded in the index.html file. I have to set one particular property to false in order for my tests to run, but so far, I haven't managed to find a way to hook into the app initialization process.
I can get at the property using code such as this:
browser.wait(
browser.executeScript('return window.Config.local;')
.then(promise => expect(promise).toBe(false)
), 5000);
But the question is where to put the call!
I have put some time into using APP_INITIALIZER, but the only way that I could get it to work was by setting it in the app.module.ts file. I'd rather not change its contents for test purposes.
I would be most appreciative if anyone had any idea how to get at the window object before the app fully initializes. I have spent three full days on this now and still no solution...
Thanks!
angular testing protractor initialization e2e-testing asked Nov 15 '18 at 19:42
Rob GravelleRob Gravelle
176112
I'm trying to test an end-to-end process in an Angular 6 app using e2e and protractor. I have a service that injects some javaScript into the page, so my tests verify that the script has been appended to the DOM.
The wrinkle is that the service checks a configuration object that is hard-coded in the index.html file. I have to set one particular property to false in order for my tests to run, but so far, I haven't managed to find a way to hook into the app initialization process.
I can get at the property using code such as this:
browser.wait(
browser.executeScript('return window.Config.local;')
.then(promise => expect(promise).toBe(false)
), 5000);
But the question is where to put the call!
I have put some time into using APP_INITIALIZER, but the only way that I could get it to work was by setting it in the app.module.ts file. I'd rather not change its contents for test purposes.
I would be most appreciative if anyone had any idea how to get at the window object before the app fully initializes. I have spent three full days on this now and still no solution...
Thanks!
angular testing protractor initialization e2e-testing angular testing protractor initialization e2e-testing asked Nov 15 '18 at 19:42
Rob GravelleRob Gravelle
176112
asked Nov 15 '18 at 19:42
Rob GravelleRob Gravelle
176112
asked Nov 15 '18 at 19:42
Rob GravelleRob Gravelle
176112
asked Nov 15 '18 at 19:42
Rob GravelleRob Gravelle
176112
asked Nov 15 '18 at 19:42
Rob GravelleRob Gravelle
176112
176112
Can you not conditionally use the APP_INITIALIZER in app module based on an environment key? Yes, it would be in your code base, but it will only run with a test flag set. Also, APP INIT doesn’t have to be in your app module, it could also live in a feature module which you could also exclude on a prod build.
– MikeOne
Nov 15 '18 at 20:21
I created a component called TestsInitializerModule. I don't suppose there's a way to dynamically load my module without including it in app.module.ts imports?
– Rob Gravelle
Nov 15 '18 at 20:49
No, probably not. However, you could dynamically import it inside your module import definitions so it will only be imported when runnig your test.
– MikeOne
Nov 15 '18 at 21:06
Again, what is your question?
– Oleksii
Nov 15 '18 at 21:29
Dynamically importing the module is a lot of work for a test! Unless someone comes up with a brilliant idea, I think that using a feature module is going to be the solution. :-)
– Rob Gravelle
Nov 15 '18 at 21:48
|
show 2 more comments
Can you not conditionally use the APP_INITIALIZER in app module based on an environment key? Yes, it would be in your code base, but it will only run with a test flag set. Also, APP INIT doesn’t have to be in your app module, it could also live in a feature module which you could also exclude on a prod build.
– MikeOne
Nov 15 '18 at 20:21
I created a component called TestsInitializerModule. I don't suppose there's a way to dynamically load my module without including it in app.module.ts imports?
– Rob Gravelle
Nov 15 '18 at 20:49
No, probably not. However, you could dynamically import it inside your module import definitions so it will only be imported when runnig your test.
– MikeOne
Nov 15 '18 at 21:06
Again, what is your question?
– Oleksii
Nov 15 '18 at 21:29
Dynamically importing the module is a lot of work for a test! Unless someone comes up with a brilliant idea, I think that using a feature module is going to be the solution. :-)
– Rob Gravelle
Nov 15 '18 at 21:48
Can you not conditionally use the APP_INITIALIZER in app module based on an environment key? Yes, it would be in your code base, but it will only run with a test flag set. Also, APP INIT doesn’t have to be in your app module, it could also live in a feature module which you could also exclude on a prod build.
– MikeOne
Nov 15 '18 at 20:21
Can you not conditionally use the APP_INITIALIZER in app module based on an environment key? Yes, it would be in your code base, but it will only run with a test flag set. Also, APP INIT doesn’t have to be in your app module, it could also live in a feature module which you could also exclude on a prod build.
– MikeOne
Nov 15 '18 at 20:21
I created a component called TestsInitializerModule. I don't suppose there's a way to dynamically load my module without including it in app.module.ts imports?
– Rob Gravelle
Nov 15 '18 at 20:49
I created a component called TestsInitializerModule. I don't suppose there's a way to dynamically load my module without including it in app.module.ts imports?
– Rob Gravelle
Nov 15 '18 at 20:49
No, probably not. However, you could dynamically import it inside your module import definitions so it will only be imported when runnig your test.
– MikeOne
Nov 15 '18 at 21:06
No, probably not. However, you could dynamically import it inside your module import definitions so it will only be imported when runnig your test.
– MikeOne
Nov 15 '18 at 21:06
Again, what is your question?
– Oleksii
Nov 15 '18 at 21:29
Again, what is your question?
– Oleksii
Nov 15 '18 at 21:29
Dynamically importing the module is a lot of work for a test! Unless someone comes up with a brilliant idea, I think that using a feature module is going to be the solution. :-)
– Rob Gravelle
Nov 15 '18 at 21:48
Dynamically importing the module is a lot of work for a test! Unless someone comes up with a brilliant idea, I think that using a feature module is going to be the solution. :-)
– Rob Gravelle
Nov 15 '18 at 21:48
|
show 2 more comments
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
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53326842%2fmodify-global-window-variable-in-angular-6-tests%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
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.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53326842%2fmodify-global-window-variable-in-angular-6-tests%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
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
Can you not conditionally use the APP_INITIALIZER in app module based on an environment key? Yes, it would be in your code base, but it will only run with a test flag set. Also, APP INIT doesn’t have to be in your app module, it could also live in a feature module which you could also exclude on a prod build.
– MikeOne
Nov 15 '18 at 20:21
I created a component called TestsInitializerModule. I don't suppose there's a way to dynamically load my module without including it in app.module.ts imports?
– Rob Gravelle
Nov 15 '18 at 20:49
No, probably not. However, you could dynamically import it inside your module import definitions so it will only be imported when runnig your test.
– MikeOne
Nov 15 '18 at 21:06
Again, what is your question?
– Oleksii
Nov 15 '18 at 21:29
Dynamically importing the module is a lot of work for a test! Unless someone comes up with a brilliant idea, I think that using a feature module is going to be the solution. :-)
– Rob Gravelle
Nov 15 '18 at 21:48