Thank you for investing your time in contributing to this project! Please take a moment to review this document in order to streamline the contribution process for you and any reviewers involved.
Read our Code of Conduct to keep our community approachable and respectable.
In this guide you will get an overview of the contribution workflow from opening an issue, creating a PR, reviewing, and merging the PR.
To get an overview of the project, read the README. Here are some resources to help you get started with open source contributions:
- Finding ways to contribute to open source on GitHub
- Set up Git
- GitHub flow
- Collaborating with pull requests
To help the project's maintainers and community quickly understand the nature of your pull request, please be sure to do the following:
- Include a descriptive Pull Request title.
- Provide a detailed description that explains the nature of the change(s) introduced. This is not only helpful for your reviewer, but also for future users who may need to revisit your Pull Request for context purposes. Screenshots/video captures are helpful here!
- Make incremental, modular changes, with a clean commit history. This helps reviewers understand your contribution more easily and maintain project quality.
Check to see that you have completed each of the following before requesting a review of your Pull Request:
- All existing unit tests are still passing (if applicable)
- Add new passing unit tests to cover the code introduced by your PR
- Update the README
- Update or add any necessary API documentation
- All commits in the branch adhere to the conventional commit format: e.g.
fix: bug #issue-number
Commits should be in the format <type>(<scope>): <description>
. This allows our team to leverage tooling for automatic releases and changelog generation. An example of a commit in this format might be: docs(readme): fix typo in documentation
type
can be any of the follow:
feat
: a feature, or breaking changefix
: a bug-fixtest
: Adding missing tests or correcting existing testsdocs
: documentation only changes (readme, changelog, contributing guide)refactor
: a code change that neither fixes a bug nor adds a featurechore
: reoccurring tasks for project maintainability (example scopes: release, deps)config
: changes to tooling configurations used in the projectbuild
: changes that affect the build system or external dependencies (example scopes: npm, bundler, gradle)ci
: changes to CI configuration files and scripts (example scopes: travis)perf
: a code change that improves performancestyle
: changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)
scope
is optional, and can be anything.
description
should be a short description of the change, written in the imperative-mood.
Follow this process if you'd like your work considered for inclusion in the project:
-
Fork the project, clone your fork, and configure the remotes:
# Clone your fork of the repo into the current directory git clone git@github.com:<YOUR_USERNAME>/react-imgix.git # Navigate to the newly cloned directory cd react-imgix # Assign the original repo to a remote called "upstream" git remote add upstream https://github.com/imgix/react-imgix
-
If you cloned a while ago, get the latest changes from upstream:
git checkout <dev-branch> git pull upstream <dev-branch>
-
Create a new topic branch (off the main project development branch) to contain your feature, change, or fix:
git checkout -b <topic-branch-name>
-
Commit your changes in logical chunks. Use Git's interactive rebase feature to tidy up your commits before making them public.
-
Locally merge (or rebase) the upstream development branch into your topic branch:
git pull [--rebase] upstream <dev-branch>
-
Push your topic branch up to your fork:
git push origin <topic-branch-name>
-
Open a Pull Request with a clear title and description.
IMPORTANT: By submitting a patch, you agree to allow the project owner to license your work under the same license as that used by the project.
To install all development dependencies, in the project's root directory, run
npm install
Once you're configured, building the JavaScript from the command line is easy:
npm run build # build react-imgix from source
npm run build:watch # watch for changes and build automatically
npm run test # run the test suite
npm run test:watch # run the test suite, watching for changes (good for TDD)
To run the browser integration tests, use one of the following commands:
npm run test:headless # runs the tests in Chrome headlessly
npm run test:headless:watch # runs the tests in Chrome headlessly and watches for changes
npm run test:browser # runs the tests in Chrome, Firefox, and, if on OS X, Safari, headlessly (excl. Safari)
npm run test:browser:watch # runs the tests in Chrome, Firefox, and, if on OS X, Safari, headlessly (excl. Safari), and watches for changes
To run the integration tests across all browsers, a BrowserStack account must be available.
BUILD_TAG=test-xxx && BROWSERSTACK_USERNAME=xxx && BROWSERSTACK_ACCESS_KEY=xxx && npm run test:browser:all