Skip to content

Latest commit

 

History

History
122 lines (81 loc) · 3.85 KB

CONTRIBUTING.md

File metadata and controls

122 lines (81 loc) · 3.85 KB

Contributing

These instructions will help you develop and test new features.

Overview

Getting Started
Integrations
Making Changes
Testing
Documentation
Build Workflow

Integrations

AddThis

AddThis is a content sharing platform. In addition to providing content sharing tools, AddThis provides tool for following, related posts, social analytics, and Audience Targeting tools.

This Inline Follow and Share buttons can be used through the AddThisToolbox component. Inline share buttons are also a part of the ProductTemplate UI.

Making Changes

Component Library

Directory: src/lib

The component library is organized according to the Atomic Design Methodology.

Component stories live in the same directory as their components. For more information on writing stories, visit Writing Stories from the Storybook docs.

Hooks

Directory: src/hooks

The component library is implemented as a set of Function components, making the use of React Hooks possible.

This project uses React Hanger, a "helpful hooks" library.

For more information on writing custom hooks, visit Building Your Own Hooks from the React docs.

Providers

Directory: src/providers

For more information, see Context from the React docs.

Styles

Directory: src/scss

Stylesheets are written in Sass; this project currently supports the .scss syntax.

Type Definitions

Directory: src/types

Utilities

Directory: src/utils

Testing

Unit and interaction tests are conducted while implementing a new component or feature. Unit tests are used to verify the output of a component, hook, or function against a fixed input value. Interaction tests render components in the browser and assert qualities about the way the component renders or changes.

CSF format stories are reusable components that can be rendered outside of Storybook, making them available to use when writing tests. For more information, visit Unit testing and Interaction testing from the Storybook docs.

This project uses the following testing libraries:

Test results for components are displayed in Storybook using Storybook Addon Jest. Before running or building the project, __tests__/results.json must be generated. The Jest addon uses this file to display test results. Failing tests will not hinder builds, but be displayed in the addon panel.

The dev and build scripts for this project are configured to run the test suite before starting or building the project.

Documentation

Storybook Docs is used to generate documentation for the component library. DocBlock comments for components needs to be written using Markdown in order to be parsed properly by Storybook Docs.

All other documentation should follow JSDoc format.

Build Workflow

To create a local production build:

yarn build

The Storybook app distribution files will be output into the public directory.