Project Firefly
A CSS Support Validator.
Installation
You can install Project Firefly either through cloning with git or by using npm (the recommended way):
npm install -g project-firefly
Usage
firefly <options>
For CLI options, use the -h (or --help) argument:
firefly -h
Usage: firefly or firefly [-i | --input <path>] [-e | --export <path>] [-w | --watch] [-j | --json] [-h | --help] [-v | --version] Options: -i, --input <path> Specify the input file path. -e, --export <path> Export the generated report in JSON format. Flags: -w, --watch Rerun firefly on file change. -j, --json Output firefly's report in JSON format. -h, --help Output usage information. -v, --version Output the version number.
Configuration File
Use a JavaScript, JSON or YAML file to specify configuration information for an entire directory and all of its subdirectories. Firefly supports the following formats:
- a
firefly
property inpackage.json
- a
.fireflyrc
file in JSON or YAML format - a
.fireflyrc.json
file - a
.fireflyrc.yaml
,.fireflyrc.yml
, or.fireflyrc.js
file - a
firefly.config.js
file exporting a JS object
Options
mode
Type: string
Default: 'default'
Modes:
default
- Validate the project and output its report.export
- Export the generated report in JSON format.json
- Output Firefly's report in JSON format.watch
- Rerun Firefly on file change.
entry
Type: string
or null
Default: null
Specify the input file path. null
will validate the entire project.
export
Type: object
Default: {filename: 'report.json', path: './'}
Properties: filename
and path
Specify the export path and filename using the relative syntax.
browserslist
Type: array
Default: ['defaults']
An array containing the project's browserslist.
disableFeedbackSystem
Type: boolean
Default: false
Whether Firefly should display the alternatives/feedback or not.
exclude
Type: array
Default: ['**/node_modules']
An array containing files and directories which Firefly should ignore. E.g. ['**/dist, **/node_modules']
ignoreAtSupports
Type: boolean
Default: false
Whether Firefly should ignore @supports
declarations or not.
ignoreVendorPrefixes
Type: boolean
Default: false
Whether Firefly should ignore venter prefixes or not. E.g. -webkit-**
, -moz-**
, etc.
Output
~/Projects/usability-test❯ firefly FAIL bootstrap.css At-Rules ✘ [8224:3] safari 12 does not support 'page'. Properties ✘ [273:3] edge 17 & ie 11 does not support 'resize'. ✘ [300:3] ie 11 does not support 'outline-offset'. ✘ [633:3] ie 11 does not support 'grid-template-columns'. ✘ [634:3] ie 11 does not support 'grid-template-rows'. ✘ [3395:3] ie 11 does not support 'appearance'. ✘ [3493:3] ie 11 does not support 'appearance'. ✘ [3509:3] ie 11 does not support 'appearance'. ✘ [3534:3] ie 11 does not support 'appearance'. ✘ [3558:3] ie 11 does not support 'appearance'. ✘ [4114:3] ie 11 does not support 'object-fit'. ✘ [4244:5] firefox 65, safari_ios 11.3 & safari 12 does not support 'orphans'. ✘ [4245:5] firefox 65, safari_ios 11.3 & safari 12 does not support 'widows'. ✘ [5042:3] firefox 65 does not support 'line-break'. ✘ [5152:3] firefox 65 does not support 'line-break'. ✘ [8217:5] firefox 65, safari_ios 11.3 & safari 12 does not support 'orphans'. ✘ [8218:5] firefox 65, safari_ios 11.3 & safari 12 does not support 'widows'. Media Features ✘ [1735:19] chrome 72, edge 17 & others does not support 'prefers-reduced-motion'. ✘ [2222:19] chrome 72, edge 17 & others does not support 'prefers-reduced-motion'. ✘ [2814:19] chrome 72, edge 17 & others does not support 'prefers-reduced-motion'. ✘ [2831:19] chrome 72, edge 17 & others does not support 'prefers-reduced-motion'. ✘ [4645:19] chrome 72, edge 17 & others does not support 'prefers-reduced-motion'. ✘ [4911:19] chrome 72, edge 17 & others does not support 'prefers-reduced-motion'. ✘ [5327:19] chrome 72, edge 17 & others does not support 'prefers-reduced-motion'.