The foundations of this solution were created using https://www.npmjs.com/package/generator-angular-es6-webpack, which creates all the base files for an Angular 1.5 app, with ES6, SCSS support.
Angular was chosen first because of my familiarity/knowledge of the framework, but also because:
- Easy for single-page applications
- Easy to implement live updates (e.g. update shopping cart dynamically)
- Easy to unit test
- Modular architecture
- Make sure you have got
nodeandnpminstalled. Note: version 7 was used for this. You can change the node version easily by installingnvm(node virtual machine). cdinto the folder and runnpm install- Note: if you installed
nvm, then runnvm install 7, and thennvm use 7
- Note: if you installed
- Run
gulp serveand accesshttp://127.0.0.1:9001/
- Run
gulp karma
- Run
./node_modules/webdriver-manager/bin/webdriver-manager updateto ensure you've got the latest version of the webdriver. - Run
./node_modules/webdriver-manager/bin/webdriver-manager startto start the selenium server. Then on another terminal: - Run
gulp protractorto run the actual tests. Remember that every time you open a new terminal you might need to runnvm use 7.
If I had given more time to invest in the project, I would have:
- Unit test everything. I only included one unit test for each kind of angular concept (controller, service, component).
- More functional tests (E2E) using Protractor (Selenium for AngularJS). Would have added more assertions and tests for the cart page.
- Although I tried to organize my CSS, it could be improved, e.g. put all animations inside
_animation.scss