Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@poppinss/colors
Advanced tools
@poppinss/colors - npm Package Compare versions
Comparing version 2.0.0 to 2.0.1
| # The MIT License | ||
| Copyright 2019 Harminder virk, contributors | ||
| Copyright 2020 Harminder virk, contributors | ||
@@ -5,0 +5,0 @@ Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the 'Software'), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: |
| { | ||
| "name": "@poppinss/colors", | ||
| "version": "2.0.0", | ||
| "version": "2.0.1", | ||
| "description": "A wrapper on top of kleur with ability to write test against the color functions", | ||
@@ -15,3 +15,2 @@ "main": "build/index.js", | ||
| "test": "node japaFile.js", | ||
| "lint": "eslint . --ext=.ts", | ||
| "clean": "del build", | ||
@@ -23,3 +22,6 @@ "compile": "npm run lint && npm run clean && tsc", | ||
| "release": "np", | ||
| "version": "npm run build" | ||
| "version": "npm run build", | ||
| "prepublishOnly": "npm run build", | ||
| "lint": "eslint . --ext=.ts", | ||
| "sync-labels": "github-label-sync --labels ./node_modules/@adonisjs/mrm-preset/gh-labels.json poppinss/colors" | ||
| }, | ||
@@ -33,4 +35,4 @@ "keywords": [ | ||
| "devDependencies": { | ||
| "@adonisjs/mrm-preset": "^2.3.4", | ||
| "@types/node": "^14.0.14", | ||
| "@adonisjs/mrm-preset": "^2.4.0", | ||
| "@types/node": "^14.0.23", | ||
| "commitizen": "^4.1.2", | ||
@@ -40,13 +42,15 @@ "cz-conventional-changelog": "^3.2.0", | ||
| "doctoc": "^1.4.0", | ||
| "eslint": "^7.3.1", | ||
| "eslint": "^7.4.0", | ||
| "eslint-config-prettier": "^6.11.0", | ||
| "eslint-plugin-adonis": "^1.0.14", | ||
| "eslint-plugin-prettier": "^3.1.4", | ||
| "github-label-sync": "^2.0.0", | ||
| "husky": "^4.2.5", | ||
| "japa": "^3.1.1", | ||
| "mrm": "^2.3.3", | ||
| "np": "^6.2.5", | ||
| "np": "^6.3.2", | ||
| "npm-audit-html": "^1.4.1", | ||
| "prettier": "2.0.5", | ||
| "ts-node": "^8.10.2", | ||
| "typescript": "^3.9.5" | ||
| "typescript": "^3.9.7" | ||
| }, | ||
@@ -63,3 +67,3 @@ "nyc": { | ||
| "hooks": { | ||
| "pre-commit": "npm run format && npm run lint && doctoc README.md --title='## Table of contents' && git add README.md", | ||
| "pre-commit": "doctoc README.md --title='## Table of contents' && git add README.md && npm audit --production --json | ./node_modules/.bin/npm-audit-html && git add npm-audit.html", | ||
| "commit-msg": "node ./node_modules/@adonisjs/mrm-preset/validateCommit/conventional/validate.js" | ||
@@ -66,0 +70,0 @@ } |
124
README.md
@@ -7,5 +7,5 @@ <div align="center"><img src="https://res.cloudinary.com/adonisjs/image/upload/q_100/v1557762307/poppinss_iftxlt.jpg" width="600px"></div> | ||
| [![circleci-image]][circleci-url] [![typescript-image]][typescript-url] [![npm-image]][npm-url] [![license-image]][license-url] | ||
| [![circleci-image]][circleci-url] [![typescript-image]][typescript-url] [![npm-image]][npm-url] [![license-image]][license-url] [![audit-report-image]][audit-report-url] | ||
| This module is a wrapper on top of Kleur to make it easier to test the output generated using the kleur API. The API exposed is 100% the same as kleur. | ||
| This module is a wrapper on top of Kleur to make it easier to test the output generated by the kleur API. The API exposed is 100% the same as kleur. | ||
@@ -17,4 +17,6 @@ <!-- START doctoc generated TOC please keep comment here to allow auto update --> | ||
| - [Why use this module?](#why-use-this-module) | ||
| - [Usage](#usage) | ||
| - [Raw Implementation](#raw-implementation) | ||
| - [The problem](#the-problem) | ||
| - [Our solution](#our-solution) | ||
| - [How to use it in real world?](#how-to-use-it-in-real-world) | ||
| - [Installation](#installation) | ||
@@ -24,21 +26,49 @@ <!-- END doctoc generated TOC please keep comment here to allow auto update --> | ||
| ## Why use this module? | ||
| This module attempts to solve two specific problems. | ||
| Have you ever wonder, how to test the output of function calls like the following? | ||
| - Make it easier to test strings using kleur color transformations. | ||
| - Provide a alternate implementation for non-tty terminals. | ||
| ### The problem | ||
| Let's imagine you are writing a test to ensure that `function dummy` outputs an error message to the console in certain situation. | ||
| ```js | ||
| import { bgRed, white } from 'kleur' | ||
| assert.equal(bgRed().white('Error'), 'Error') // fails | ||
| import { bgRed } from 'kleur' | ||
| function dummy () { | ||
| if (someCondition) { | ||
| console.log(bgRed().white('Error')) | ||
| } | ||
| } | ||
| ``` | ||
| Well, you can make use of modules like [strip-ansi](https://github.com/chalk/strip-ansi) to strip the ansi codes and get back the plain string. | ||
| You may attempt to test the output as follows: | ||
| ```js | ||
| import { bgRed, white } from 'kleur' | ||
| const output = trapConsoleMessage() | ||
| dummy() | ||
| assert.equal(output, 'Error') // fails | ||
| ``` | ||
| The assertion will fail, since the string `Error` has ansi sequences applied to it to make it colorful. | ||
| To workaround this behavior, you can use a module like [strip-ansi](https://github.com/chalk/strip-ansi) to string the ansi sequences and write assertions against the plain string. | ||
| ```js | ||
| import stripAnsi from 'strip-ansi' | ||
| assert.equal(stripAnsi(bgRed().white('Error')), 'Error') // passes | ||
| const output = trapConsoleMessage() | ||
| dummy() | ||
| assert.equal(stripAnsi(output), 'Error') // passes | ||
| ``` | ||
| However, this module takes a step forward with a fake colors API, that you can use during testing to reliably test the output. | ||
| Now, your assertions are passing, but there is no way to know which kleur transformations were applied to the string. | ||
| ### Our solution | ||
| Instead of relying on `strip-ansi`, we ship with an alternative implementation of kleur, which doesn't apply ansi sequences at first place. Example: | ||
| ```js | ||
@@ -48,66 +78,70 @@ import { FakeColors } from '@poppinss/colors' | ||
| assert.equal(colors.bgRed().white('Error'), 'bgRed(white(Error))') // passes | ||
| const output = colors.bgRed().white('Error') | ||
| assert.equal(output, 'bgRed(white(Error))') // passes | ||
| ``` | ||
| ## Usage | ||
| **Notice the difference in the output?** Instead of applying the background color and the text color. We wrap the value inside the applied transformations and return it back as a string. | ||
| Install the package from npm registry as follows: | ||
| ### How to use it in real world? | ||
| ```sh | ||
| npm i @poppinss/colors | ||
| At AdonisJS, we rely on the `NODE_ENV` environment variable to decide the implementation to choose. For example: | ||
| # yarn | ||
| yarn add @poppinss/colors | ||
| ``` | ||
| and then use it as follows: | ||
| ```ts | ||
| import { Colors } from '@poppinss/colors' | ||
| const colors = new Colors() | ||
| import { FakeColors, Colors } from '@poppinss/colors' | ||
| // API same as kleur from here | ||
| export default const colors = process.env.NODE_ENV === 'testing' | ||
| ? new FakeColors() | ||
| : new Colors() | ||
| ``` | ||
| When wring tests, you can make your code rely on `FakeColors` object instead of the `Colors` object. For example: | ||
| Now, inside the entire codebase, we import the above helper for colorizing output. | ||
| ```ts | ||
| import { FakeColors } from '@poppinss/colors' | ||
| const colors = new FakeColors() | ||
| // API same as kleur from here | ||
| import colors from './helpers/colors' | ||
| colors.red('Error') | ||
| ``` | ||
| ## Raw Implementation | ||
| ## Installation | ||
| The `Raw` implementation exposes the same API as kleur, but does not apply any formatting/colors to the output string. You can use the raw implementation when the terminal does not support colors. For example: | ||
| Install the package from npm registry as follows: | ||
| ```ts | ||
| import { Colors, Raw } from '@poppinss/colors' | ||
| import { level } from 'color-support' | ||
| ```sh | ||
| npm i @poppinss/colors | ||
| const colors = level > 0 ? new Colors() : new Raw() | ||
| colors.red('hello world') | ||
| # yarn | ||
| yarn add @poppinss/colors | ||
| ``` | ||
| Finally, there is a method called `getBest` to get the best available implementation instance for your runtime. | ||
| and then use it as follows: | ||
| ```ts | ||
| import { getBest } from '@poppinss/colors' | ||
| const colors = getBest(false) | ||
| ``` | ||
| import { | ||
| FakeColors, | ||
| Colors, | ||
| Raw, | ||
| } from '@poppinss/colors' | ||
| The `getBest` method returns following outputs | ||
| // Real implementation | ||
| const colors = new Colors() | ||
| - An instance of [Raw](https://github.com/poppinss/colors/blob/develop/src/Raw.ts) when the terminal does not supports colors. | ||
| - An instance of [FakeColors](https://github.com/poppinss/colors/blob/develop/src/Stringify.ts) when the first argument passed to the method is `true`. | ||
| - Otherwise returns an instance of [Colors](https://github.com/poppinss/colors/blob/develop/src/Kleur.ts). | ||
| // Use for testing | ||
| const fakeColors = new FakeColors() | ||
| // When running in non-tty terminals | ||
| const rawColors = new Raw() | ||
| ``` | ||
| [circleci-image]: https://img.shields.io/circleci/project/github/poppinss/colors/master.svg?style=for-the-badge&logo=circleci | ||
| [circleci-url]: https://circleci.com/gh/poppinss/colors 'circleci' | ||
| [typescript-image]: https://img.shields.io/badge/Typescript-294E80.svg?style=for-the-badge&logo=typescript | ||
| [typescript-url]: "typescript" | ||
| [npm-image]: https://img.shields.io/npm/v/@poppinss/colors.svg?style=for-the-badge&logo=npm | ||
| [npm-url]: https://npmjs.org/package/@poppinss/colors 'npm' | ||
| [license-image]: https://img.shields.io/npm/l/@poppinss/colors?color=blueviolet&style=for-the-badge | ||
| [license-url]: LICENSE.md 'license' | ||
| [audit-report-image]: https://img.shields.io/badge/-Audit%20Report-blueviolet?style=for-the-badge | ||
| [audit-report-url]: https://htmlpreview.github.io/?https://github.com/poppinss/colors/blob/develop/npm-audit.html "audit-report" |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by5.11%
18652
- Number of lines in readme file
- increased by30.91%
144
Worsened metrics
- Dev dependency count
- increased by11.76%
19
No dependency changes