npmpackage.info

Gathering detailed insights and metrics for react-shallow-renderer

Other packages similar to react-shallow-renderer

react-addons-test-utils

15.6.2

This package provides the React TestUtils add-on.

enzyme-shallow-equal

1.0.7

Adaptation of react-addons-shallow-compare, for independent usage

@storybook/react

8.4.5

Storybook React renderer

extend-shallow

3.0.2

Extend an object with the properties of additional objects. node.js/javascript util.

Gathering detailed insights and metrics for react-shallow-renderer

react-shallow-renderer

Shallow rendering for React.

16.15.0

MIT

JavaScript

538,379,422 3.4

Installations

npm install react-shallow-renderer

Pull Requests

Open

17

Total

110

Closed

60

Merged

33

Issues

Open

6

Total

12

Closed

6

Releases

16.14.1 (October 21, 2020)

16.4.1

Published on 21 Oct 2020

16.13.1 (March 16, 2020)

v16.13.1

Published on 16 Mar 2020

16.13.0 (February 28, 2020)

v16.13.0

Published on 28 Feb 2020

16.12.0 (February 26, 2020)

v16.12.0

Published on 26 Feb 2020

View all 4 releases

Developer

NMinhNguyen

Developer Guide

BETA

Module System

CommonJS

Min. Node Version

Typescript Support

No

Node Version

16.14.2

NPM Version

8.5.0 Statistics

31 Stars

298 Commits

12 Forks

9 Watching

18 Branches

4 Contributors

Updated on 18 Jun 2024

Languages

JavaScript (100%)

Total Downloads

Cumulative downloads

Total Downloads

538,379,422

Last day

-4.5%

790,993

Compared to previous day

Last week

3.6%

4,214,202

Compared to previous week

Last month

8.7%

17,560,981

Compared to previous month

Last year

11.7%

193,144,242

Compared to previous year

Daily Downloads

Weekly Downloads

Monthly Downloads

Yearly Downloads

Versions

`react-shallow-renderer`

When writing unit tests for React, shallow rendering can be helpful. Shallow rendering lets you render a component "one level deep" and assert facts about what its render method returns, without worrying about the behavior of child components, which are not instantiated or rendered. This does not require a DOM.

Installation

1# npm
2npm install react-shallow-renderer --save-dev
3
4# Yarn
5yarn add react-shallow-renderer --dev

Usage

For example, if you have the following component:

1function MyComponent() {
2  return (
3    <div>
4      <span className="heading">Title</span>
5      <Subcomponent foo="bar" />
6    </div>
7  );
8}

Then you can assert:

1import ShallowRenderer from 'react-shallow-renderer';
2// in your test:
3const renderer = new ShallowRenderer();
4renderer.render(<MyComponent />);
5const result = renderer.getRenderOutput();
6expect(result.type).toBe('div');
7expect(result.props.children).toEqual([
8  <span className="heading">Title</span>,
9  <Subcomponent foo="bar" />,
10]);

Shallow testing currently has some limitations, namely not supporting refs.

Note:

We also recommend checking out Enzyme's Shallow Rendering API. It provides a nicer higher-level API over the same functionality.

Reference

`shallowRenderer.render()`

You can think of the shallowRenderer as a "place" to render the component you're testing, and from which you can extract the component's output.

shallowRenderer.render() is similar to ReactDOM.render() but it doesn't require DOM and only renders a single level deep. This means you can test components isolated from how their children are implemented.

`shallowRenderer.getRenderOutput()`

After shallowRenderer.render() has been called, you can use shallowRenderer.getRenderOutput() to get the shallowly rendered output.

You can then begin to assert facts about the output.

No vulnerabilities found.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

10

License

Determines if the project has defined a license.

9

Security-Policy

Determines if the project has published a security policy.

3

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

Maintained

Determines if the project is "actively maintained".

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Fuzzing

Determines if the project uses fuzzing.

0

SAST

Determines if the project uses static code analysis.

0

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

Score

3.4

/10

Last Scanned on 2024-11-25

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More

Other packages similar to react-shallow-renderer

Other packages similar to react-shallow-renderer

react-shallow-renderer

Installations

Pull Requests

17

110

60

33

Issues

6

12

6

Releases

Developer

NMinhNguyen

Developer Guide

CommonJS

No

16.14.2

8.5.0

Statistics

Languages

Total Downloads

538,379,422

Daily Downloads

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

Peer Dependencies

Dev Dependencies

react-shallow-renderer

Installation

Usage

Reference

shallowRenderer.render()

shallowRenderer.getRenderOutput()

10

10

9

3

0

0

0

0

0

3.4

/10

`react-shallow-renderer`

`shallowRenderer.render()`

`shallowRenderer.getRenderOutput()`