React Polymorphic Tracking

React component that grabs the current tracking data from the Newsnet API and sets up the appropriate trackers (WEMF, Webseismo, Google Tag Manager).

Installation

1yarn add @ta-interaktiv/react-polymorphic-tracking

API

PolymorphicTracking

Extends React.PureComponent

Component to track visits to a website, accessing the Newsnet API for all tracking information. Currently supports GTM, WEMF and Webseismo. Additional Providers need to be added separately.

Parameters

• articleId string? The article ID of the link article in the CD. If not available it will assume that content is being loaded in an iframe. (So, yes, you can use this component without adding the articleId attribute.)

Examples

1import Tracking from '@ta-interaktiv/react-polymorphic-tracking'
2function YourComponent (props) {
3  return (
4    <div>
5      <Tracking articleId='3352335' />
6    </div>
7  )
8}

trackWithImage

Helper function. Tracks a visit by calling the URL of a tracking pixel.

Parameters

• src string The URL of the tracking pixel to use as the image source.

Returns void

Contributing

Code resides in /src.

This repository follows the Standard JS style. To fix your code, run

1yarn run fix

Type checking is provided by Flow.

1yarn run flow

Styling

Styles reside in /style and/or /scss.

Testing

Test cases are provided using Storybook. Add test cases in /stories/index.js, and run them with

1yarn run storybook

They will appear on http://localhost:9001.

Automated tests are written for Jest and can be found in /test. Run the test suite using

1yarn run test

Transpiling

Babel is used to provide ES5 compatible code. To compile run

1yarn run dist

Documentation

Documentation is generated from source, using both JSDoc comments as well as Flow type annotations. Update the documentation in this file using

1yarn run docs

Changelog

The changelog is generated from git commits. In order to update the changelog, you may use

1yarn run changelog

– however, ever better is

Versioning

For correct tagging, updating the changelog etc. you can use the appropriate NPM scripts.

These scripts will 1. Bump the package.json version number 2. Update the documentation 3. Update the changelog 4. Commit these changes 5. Tag the commit with the correct version number

For project changes that improve the code in some way, but don't change the API in any way, use

1yarn run version:patch

For project changes that add to the API or add functionality but will not affect the functioning of older implementations, use

1yarn run version:minor

For project changes that change the component in a fundamental way that would require code that implemented an older version of this component to be rewritten, use

1yarn run version:major

Publishing

In order to publish everything, both to the repository as well as NPM, use

1yarn run push