site-tracking-tags v0.0.1

Site tracking tags UI

How to run

Be sure to be running the node version defined in .nvmrc file. If you use nvm you can just run nvm use on the root path of this ui project and it should set the proper node version.

1. Install all dependencies

   npm install

2. Run webpack

   npm run dev

This will start a development server in port 8080.

Testing

Juniper Tests

Using cypress UI

1. Run the webpack (from /site-tracking-tags/client)

       npm run dev:test

2. Run Juniper (from /site-tracking-tags/ui-test)

       npm run test:dev

Headless with TC config

1. Build the test bundle (from /site-tracking-tags/client)

       npm run build:test

2. Run Juniper (from /ui-tests)

       npm run test

Jest Tests

1. Run Jest (from /site-tracking-tags/client)

       npm run test

Config files

• In order to use different configuration files, different npm scripts are provided on the project's package.json:

dev => to run locally
dev:test => to run a wds serving the test bundle for Juniper tests locally
build:prod => builds the production bundle (TC)
build:stage => builds the stage bundle (TC)
build:test => builds the test bundle (TC Juniper Tests)
build => builds both prod and stage bundles (TC)

dev => Will expect to find wds serving app.dev.bundle.js on port 8080
stage => Will expect to find a built app.stage.bundle.js
prod => Will expect to find a built app.prod.bundle.js

Others

If you got code-style errors in the FE and you want to get this auto-fixed, you can do so by running the following command in client folder: npm run eslint-autofix. Please keep in mind that your files may get changed.

Troubleshooting

• Seeing the "Unable to mount the Site tracking tags page" message

  • Make sure your application.conf has a valid environment value, it should be only "dev", "stage" or "prod"

• Not seeing the Site tracking tags page at all (blank page)

  • If you're running with environment = "dev" make sure you're also running the webpack server

  • If you're running with environment = "stage" or "prod" make sure you built before-hand build:stage / build:prod

    • NOTE: Using these bundles locally is discouraged because you might end up hitting cdn to fetch creatives that don't exist and trigger alerts, please be aware of such risk and if you don't actually need to see the creatives, consider changing the config.*.json to hit a different URL, in addition, the routes file must be changed adding the /targeting prefix to a few api endpoints (strategies, details, and strategy)

• Not seeing any creatives (endless loading circle on page)

  • Check if the strategies and campaign details are being fetched properly, as mentioned above the local routes don't support the endpoints for stage and prod bundles

• Jest API Tests failing to import Config
  • Make sure the config.test.json file exists