pix-core-ui v0.3.17

core-ui

Running your app against a local version of core-ui

Setup:

1. Set your core-ui version in package.json to point to local "pix-core-ui": "file:../../core-ui"
2. comment out pix-core-ui entry in AutoDllPlugin in your webpack config

After making core-ui changes:

1. yarn build (in core-ui)
2. yarn add file:../../core-ui (in the app using core-ui). Your dev server should pick up the change and rebuild

Background:

AutoDllPlugin aggressively caches packages - unless you change a version or something similarly drastic it won't update. They don't offer any configs for hashing or other change detection. Their recommendation was to omit the package from the AutoDllPlugin entries, thus treating it like any other source. This makes HardSourcePlugin happy too, without getting creative with its own hashing.

Setup

1. clone repo
2. cd into repo
3. cd into www/
4. run:

yarn
yarn start

(dev server is now running)

You'll see a log message displaying the URL for the app. For core-ui as of writing it is http://localhost:9001

To run just the build without the dev server (important for distribution):

yarn build

Unit tests

Run tests

yarn test

Run tests with coverage

yarn coverage

Run tests on specific files (partial or full filename)

yarn test:grep interest

Prepare for core-ui to be imported into another app

1. yarn build to create the core-ui library distribution
2. Commit changes in your branch (remember to commit dist/ as well)
3. Tag the branch:
   • If you are still in WIP mode, the tag format should be in this form: vMajor.Minor.Revision-pixXXX (v0.0.1-pix001)
   • If you are creating a final tag for a functional change, the tag should be in this form: vMajor.Minor.Revision (v0.0.1)

Importing into host application (from scratch)

1. In the host app, i.e. targeting-manager-ui, cd to www
2. run npm install pix-core-ui@tag-name
3. import 'pix-core-ui'; somewhere in the app

4. Within a top-level angular module add 'pixCoreUiCommon' as a dependency - see below:

   angular.module('app', [
       ...
       'ngMaterial',
       'ui.router',
       'pixCoreUiCommon',
       ...

Updating bower-material needs update

• If updating from github:photusenigma/bower-material to github:pixablity/bower-material - remove node_modules and jspm_packages directories if they exist
• In www/package.json, update the angular-material line to this: github:pixability/bower-material@1.1.1-pix018 (or latest tag)
• In the jspm-config.js file update the angular-material line around line 93 to this: github:pixability/bower-material@1.1.1-pix018 (or latest tag)
• run npm install
• run jspm install
• run jspm clean
• run gulp bundle

Running Unit Tests in Docker

In environments such as Jenkins servers where there is no screen device available the following docker command line can be used to execute unit tests (assumes your current working directory is the root of this project):

```
docker run --rm -it -v $(pwd):/app pixability/python:2.7-chrome ansible-playbook -c local /app/jenkins/jenkins.yml
```

An HTML coverage report will be generated into the src/coverage folder, and a JUnit XML report will also be output to the src folder.

Style guide (pretty old)

Style Guide Project: https://docs.google.com/a/pixability.com/document/d/145Ik0Tj-QihfsnjqsOj-9cKbamRyiJrKcBg0UZymbCs/edit?usp=sharing_eid&ts=579ffdfb

Style Guide doc: https://pixability.github.io/core-ui/css.html#CSS