Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Warning: Failed prop type: Invalid prop `colors` supplied to `Line`.

See original GitHub issue

With react 16.8.1, react-dom 16.8.1 and @nivo/line 0.56.0.

Providing a single hex code string to the colors property results in PropTypes error:

Warning: Failed prop type: Invalid prop `colors` supplied to `Line`.
    in Line (created by pure(Line))
    in pure(Line) (created by withPropsOnChange(pure(Line)))
    in withPropsOnChange(pure(Line)) (created by withPropsOnChange(withPropsOnChange(pure(Line))))
    in withPropsOnChange(withPropsOnChange(pure(Line))) (created by withPropsOnChange(withPropsOnChange(withPropsOnChange(pure(Line)))))
    in withPropsOnChange(withPropsOnChange(withPropsOnChange(pure(Line)))) (created by withPropsOnChange(withPropsOnChange(withPropsOnChange(withPropsOnChange(pure(Line))))))
    in withPropsOnChange(withPropsOnChange(withPropsOnChange(withPropsOnChange(pure(Line))))) (created by withPropsOnChange(withPropsOnChange(withPropsOnChange(withPropsOnChange(withPropsOnChange(pure(Line)))))))
    in

etc. etc. etc.

Example here https://codesandbox.io/s/p5y6l4wym

Issue Analytics

State:
Created 4 years ago
Comments:6 (4 by maintainers)

Top GitHub Comments

1reaction

plouccommented, Apr 18, 2019

Because it’s not a valid colors property, even if it passes, if you want to use a single color, you should use colors={() => 'red'} plain color is supported for inherited colors such as borders/links…

0reactions

RabeeAbuBaker-Exaltcommented, Jul 19, 2020

Kind of related: Failed prop type: Invalid prop yScale supplied to Line

Why would I get this? It seems that yscale is a fine property.

Make sure that you provide the full property. e.g. yScale={{ type: 'linear', min: 'auto', max: 'auto', stacked: false, reverse: false, }}

Top Results From Across the Web

Failed prop type: Invalid prop `value` of type `number ...

Warning : Failed prop type: Invalid prop `value` of type `number` supplied to `TextInput`, expected `string`. I have a postalCode and it is ......

Typechecking With PropTypes - React

When an invalid value is provided for a prop, a warning will be shown in the JavaScript console. For performance reasons, propTypes is...

Invalid props.style key 'textAlign' supplied to 'View'-Reactjs

Coding example for the question Failed prop type: Invalid props.style key 'textAlign' supplied to 'View'-Reactjs.

How to Use PropTypes in React - freeCodeCamp

PropTypes are a good first line defense when it comes to debugging your apps ... to make sure a warning is shown if...

FormidableLabs/victory - Gitter

victory/lib/index.js Module build failed: Error: [BABEL] ... Warning: Failed propType: Invalid undefined domain of type object supplied to VictoryAxis ...