Latest news about Bitcoin and all cryptocurrencies. Your daily crypto news habit.
I am not a part of Stackblitz team so it is not a promotion article:-) I just think Stackblitz is a great way to present your code for articles readers. But longtime one small feature was escaping me: how I can run an Angular project on stackblitz and then switch the same project to run unit tests. Interested? Keep reading!
Switch Stachblitz Angular project to unit test run. (Pic by Mikkel Bech0Why at all should I run Angular project unit tests in stackblits?
Well, a few times I need unit test running for learning purposes or to create some playground links to refer in the tech articles. So…
Start your GitHub project in stackblitz
Everybody knows how to start your Angular CLI project from GitHub on a stackblitz. Here is a quote from an official doc:
Import from Github
You can run any public repo on Github by providing the username + repo name like so:
stackblitz.com/github/{GH_USERNAME}/{REPO_NAME}
For example, here is my repo link:
https://github.com/kievsash/NoSniffOptionTest
And respective stackblitz link will be:
https://stackblitz.com/github/kievsash/NoSniffOptionTest
Here you can see that project with usual run:
Making it run our unit tests
OK, good, I started it. But how to run tests on it? It was not so obvious for me till I found out that
stackblitz just run main.ts file
(one of the things that seem so easy when you know it:-).
So, to start Jasmin tests for your project in a stackblits we need to put all unit tests bootstrapping code into main.ts file. So let's rename our current main.ts to main.bck and create a new main.ts file.
To run our unit tests with Jasmin from main.ts we should do next:
- Import and initialize jasmine and jasmine for browser modules
- Import zone.js module for testing
- Import out .spec.ts files
- Bootstrap Angular test environment
OK, let's do this:
And here is stackblitz example:
Conclusion
Now if you need to provide playground with running unit tests for some Angular CLI project from Github repo — you know how to do this!
Plz, leave your stackblitz Angular gotchas in comments!
If you liked this article — follow me on twitter for more Angular and RxJS articles!
Running Angular project unit-tests on Stackblitz was originally published in Hacker Noon on Medium, where people are continuing the conversation by highlighting and responding to this story.
Disclaimer
The views and opinions expressed in this article are solely those of the authors and do not reflect the views of Bitcoin Insider. Every investment and trading move involves risk - this is especially true for cryptocurrencies given their volatility. We strongly advise our readers to conduct their own research when making a decision.