Socket
Socket
Sign inDemoInstall

react-async-ssr

Package Overview
Dependencies
15
Maintainers
1
Versions
21
Alerts
File Explorer

Advanced tools

npm Scripts

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 0.6.0 to 0.7.0

37

changelog.md
# Changelog
## 0.7.0
Breaking changes:
* Drop support for Node v8
Refactor:
* Replace utils with packages
* Import file extensions
* Fix lint error
No code:
* NPM ignore `.DS_Store` files
* Header code comments
* Fix spacing
Tests:
* Check no client-side hydration warnings except where fallbacks triggered
Dev:
* Update dev dependencies
* ESLint ignore coverage dir
* ESLint not ignore dot files
* Tab width 2 in `.editorconfig`
* Remove `npm-debug.log` from `.gitignore`
* Remove `sudo` from Travis CI config
Docs:
* Versioning policy
* Reformat code examples
* Update license year
## 0.6.0

@@ -4,0 +41,0 @@

6

index.js
/* --------------------
* react-async-ssr module
* Entry point
* ------------------*/

@@ -7,3 +8,4 @@

// Re-export lib
module.exports = require('./lib/');
// Exports
module.exports = require('./lib/index.js');

2

lib/abort.js

@@ -9,3 +9,3 @@ /* --------------------

// Imports
const {ABORT} = require('./symbols');
const {ABORT} = require('./symbols.js');

@@ -12,0 +12,0 @@ // Exports

1

lib/constants.js

@@ -9,2 +9,3 @@ /* --------------------

// Exports
module.exports = {

@@ -11,0 +12,0 @@ TYPE_SUSPENSE: 'suspense',

10

lib/handle.js

@@ -10,9 +10,9 @@ /* --------------------

const {toArray} = require('react').Children;
const {last} = require('lodash');
// Imports
const {TYPE_SUSPENSE, TYPE_PROMISE} = require('./constants'),
{NO_SSR} = require('./symbols'),
{followAndAbort} = require('./abort'),
walkTree = require('./walkTree'),
{last} = require('./utils');
const {TYPE_SUSPENSE, TYPE_PROMISE} = require('./constants.js'),
{NO_SSR} = require('./symbols.js'),
{followAndAbort} = require('./abort.js'),
walkTree = require('./walkTree.js');

@@ -19,0 +19,0 @@ // Exports

3

lib/index.js

@@ -9,5 +9,6 @@ /* --------------------

// Imports
const Renderer = require('./renderer');
const Renderer = require('./renderer.js');
// Exports
module.exports = {

@@ -14,0 +15,0 @@ renderToStringAsync(element, options) {

2

lib/nodes.js

@@ -9,3 +9,3 @@ /* --------------------

// Imports
const {isDev} = require('./rendererSuper');
const {isDev} = require('./rendererSuper.js');

@@ -12,0 +12,0 @@ // Exports

20

lib/renderer.js

@@ -10,15 +10,17 @@ /* --------------------

const {toArray} = require('react').Children;
const {last} = require('lodash');
// Imports
const {TYPE_SUSPENSE, TYPE_PROMISE, TYPE_FALLBACK, TYPE_TEXT} = require('./constants'),
{ReactDOMServerRenderer, isDev} = require('./rendererSuper'),
shimMethods = require('./shim'),
handleMethods = require('./handle'),
nodeMethods = require('./nodes'),
{abort} = require('./abort'),
treeToHtml = require('./treeToHtml'),
walkTree = require('./walkTree'),
{isRenderableElement, last} = require('./utils');
const {TYPE_SUSPENSE, TYPE_PROMISE, TYPE_FALLBACK, TYPE_TEXT} = require('./constants.js'),
{ReactDOMServerRenderer, isDev} = require('./rendererSuper.js'),
shimMethods = require('./shim.js'),
handleMethods = require('./handle.js'),
nodeMethods = require('./nodes.js'),
{abort} = require('./abort.js'),
treeToHtml = require('./treeToHtml.js'),
walkTree = require('./walkTree.js'),
{isRenderableElement} = require('./utils.js');
// Exports
class Renderer extends ReactDOMServerRenderer {

@@ -25,0 +27,0 @@ /**

1

lib/rendererSuper.js

@@ -18,2 +18,3 @@ /* --------------------

// Exports
module.exports = {

@@ -20,0 +21,0 @@ ReactDOMServerRenderer,

6

lib/shim.js

@@ -10,6 +10,8 @@ /* --------------------

const {toArray} = require('react').Children;
const isPromise = require('is-promise');
const isReactClassComponent = require('is-class-component');
// Imports
const {TYPE_SUSPENSE, TYPE_PROMISE} = require('./constants'),
{isPromise, isReactElement, isReactClassComponent, isSuspenseType} = require('./utils');
const {TYPE_SUSPENSE, TYPE_PROMISE} = require('./constants.js'),
{isReactElement, isSuspenseType} = require('./utils.js');

@@ -16,0 +18,0 @@ // Exports

1

lib/symbols.js

@@ -9,2 +9,3 @@ /* --------------------

// Exports
module.exports = {

@@ -11,0 +12,0 @@ NO_SSR: '$_react-async-ssr/symbols.NO_SSR',

4

lib/treeToHtml.js

@@ -9,4 +9,4 @@ /* --------------------

// Imports
const {TYPE_TEXT, TYPE_PROMISE, TYPE_FALLBACK} = require('./constants'),
{ON_MOUNT} = require('./symbols');
const {TYPE_TEXT, TYPE_PROMISE, TYPE_FALLBACK} = require('./constants.js'),
{ON_MOUNT} = require('./symbols.js');

@@ -13,0 +13,0 @@ // Exports

24

lib/utils.js

@@ -10,2 +10,3 @@ /* --------------------

const React = require('react');
const {isObject} = require('is-it-type');

@@ -16,20 +17,9 @@ // Capture React element types

// Exports
module.exports = {
isObject,
isPromise,
isReactElement,
isRenderableElement,
isSuspenseType,
isReactClassComponent,
last
isSuspenseType
};
function isObject(o) {
return o != null && typeof o === 'object';
}
function isPromise(o) {
return isObject(o) && typeof o.then === 'function';
}
function isReactElement(e) {

@@ -46,9 +36,1 @@ return isObject(e) && e.$$typeof === REACT_ELEMENT_TYPE;

}
function isReactClassComponent(c) {
return !!c.prototype && !!c.prototype.isReactComponent;
}
function last(arr) {
return arr[arr.length - 1];
}

51

package.json
{
"name": "react-async-ssr",
"version": "0.6.0",
"version": "0.7.0",
"description": "Render React Suspense on server",

@@ -17,2 +17,6 @@ "main": "index.js",

"dependencies": {
"is-class-component": "^1.1.1",
"is-it-type": "^3.1.1",
"is-promise": "^2.1.0",
"lodash": "^4.17.15",
"react-dom": "~16.9.0"

@@ -24,27 +28,28 @@ },

"devDependencies": {
"@babel/core": "^7.7.4",
"@babel/preset-env": "^7.7.4",
"@babel/preset-react": "^7.7.4",
"@overlookmotel/eslint-config": "^5.0.1",
"@overlookmotel/eslint-config-jest": "^3.0.1",
"@overlookmotel/eslint-config-react": "^5.0.0",
"babel-eslint": "^10.0.3",
"babel-jest": "^24.9.0",
"@babel/core": "^7.9.0",
"@babel/preset-env": "^7.9.0",
"@babel/preset-react": "^7.9.4",
"@overlookmotel/eslint-config": "^7.1.2",
"@overlookmotel/eslint-config-node": "^2.0.0",
"@overlookmotel/eslint-config-jest": "^4.0.1",
"@overlookmotel/eslint-config-react": "^7.0.0",
"babel-eslint": "^10.1.0",
"babel-jest": "^25.2.6",
"cheerio": "^1.0.0-rc.3",
"coveralls": "^3.0.9",
"cross-env": "^6.0.3",
"eslint": "^6.7.1",
"eslint-config-airbnb": "^18.0.1",
"eslint-config-airbnb-base": "^14.0.0",
"coveralls": "^3.0.11",
"cross-env": "^7.0.2",
"eslint": "^6.8.0",
"eslint-config-airbnb": "^18.1.0",
"eslint-config-airbnb-base": "^14.1.0",
"eslint-plugin-eslint-comments": "^3.1.2",
"eslint-plugin-import": "^2.18.2",
"eslint-plugin-jest": "^23.0.5",
"eslint-plugin-import": "^2.20.2",
"eslint-plugin-jest": "^23.8.2",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-node": "^10.0.0",
"eslint-plugin-react": "^7.16.0",
"eslint-plugin-react-hooks": "^1.7.0",
"fs-extra": "^8.1.0",
"jest": "^24.9.0",
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-react": "^7.19.0",
"eslint-plugin-react-hooks": "^2.5.1",
"fs-extra": "^9.0.0",
"jest": "^25.2.7",
"jest-each-object": "^1.0.0",
"jsdom": "^15.2.1",
"jsdom": "^16.2.2",
"prop-types": "^15.7.2",

@@ -75,3 +80,3 @@ "react": "~16.9.0"

"engines": {
"node": ">=8.3.0"
"node": ">=10"
},

@@ -78,0 +83,0 @@ "readmeFilename": "README.md",

56

README.md

@@ -30,7 +30,7 @@ [![NPM version](https://img.shields.io/npm/v/react-async-ssr.svg)](https://www.npmjs.com/package/react-async-ssr)

```js
```jsx
const ReactDOMServer = require('react-dom/server');
function render() {
const html = ReactDOMServer.renderToString(<App />);
const html = ReactDOMServer.renderToString( <App /> );
return html;

@@ -42,7 +42,7 @@ }

```js
```jsx
const ReactDOMServer = require('react-async-ssr');
async function render() {
const html = await ReactDOMServer.renderToStringAsync(<App />);
const html = await ReactDOMServer.renderToStringAsync( <App /> );
return html;

@@ -54,7 +54,7 @@ }

```js
```jsx
function App() {
return (
<div>
<Suspense fallback={<Spinner />}>
<Suspense fallback={ <Spinner /> }>
<LazyComponent />

@@ -89,14 +89,14 @@ <LazyComponent />

```js
```jsx
let data = null, promise;
function LazyData() {
if (data) return <div>{data.foo}</div>;
if (data) return <div>{ data.foo }</div>;
if (!promise) {
promise = new Promise(resolve => {
setTimeout(() => {
promise = new Promise( resolve => {
setTimeout( () => {
data = {foo: 'bar'};
resolve();
}, 1000);
});
}, 1000 );
} );
}

@@ -110,3 +110,3 @@

<div>
<Suspense fallback={<div>Loading...</div>}>
<Suspense fallback={ <div>Loading...</div> }>
<LazyData />

@@ -118,3 +118,3 @@ </Suspense>

const html = await ReactDOMServer.renderToStringAsync(<App />);
const html = await ReactDOMServer.renderToStringAsync( <App /> );

@@ -128,4 +128,4 @@ // html === '<div>bar</div>'

```js
const {createResource} = require('react-cache');
```jsx
const { createResource } = require('react-cache');

@@ -146,3 +146,3 @@ const PokemonResource = createResource(

<div>
<Suspense fallback={<div>Loading...</div>}>
<Suspense fallback={ <div>Loading...</div> }>
<Pokemon id={1} />

@@ -156,3 +156,3 @@ <Pokemon id={2} />

const html = await ReactDOMServer.renderToStringAsync(<App />);
const html = await ReactDOMServer.renderToStringAsync( <App /> );

@@ -212,3 +212,3 @@ // html === `

```js
const {ON_MOUNT} = require('react-async-ssr/symbols');
const { ON_MOUNT } = require('react-async-ssr/symbols');
```

@@ -236,4 +236,4 @@

```js
const {NO_SSR} = require('react-async-ssr/symbols');
```jsx
const { NO_SSR } = require('react-async-ssr/symbols');

@@ -248,3 +248,3 @@ function LazyNoSSR() {

return (
<React.Suspense fallback={<div>Loading...</div>}>
<React.Suspense fallback={ <div>Loading...</div> }>
<LazyNoSSR/>

@@ -276,6 +276,6 @@ </React.Suspense>

```js
```jsx
function App() {
return (
<React.Suspense fallback={<div>Loading...</div>}>
<React.Suspense fallback={ <div>Loading...</div> }>
<LazyNoSSR/> <!-- throws `[NO_SSR]` promise -->

@@ -302,3 +302,3 @@ <LazySSR/> <!-- will not be rendered -->

```js
const {ABORT} = require('react-async-ssr/symbols');
const { ABORT } = require('react-async-ssr/symbols');

@@ -332,2 +332,8 @@ function AbortableLazy() {

## Versioning
This module follows [semver](https://semver.org/). Breaking changes will only be made in major version updates.
All active NodeJS release lines are supported (v10+ at time of writing). After a release line of NodeJS reaches end of life according to [Node's LTS schedule](https://nodejs.org/en/about/releases/), support for that version of Node may be dropped at any time, and this will not be considered a breaking change. Dropping support for a Node version will be made in a minor version update (e.g. 1.2.0 to 1.3.0). If you are using a Node version which is approaching end of life, pin your dependency of this module to patch updates only using tilde (`~`) e.g. `~1.2.3` to avoid breakages.
## Tests

@@ -334,0 +340,0 @@

5

symbols.js

@@ -8,3 +8,4 @@ /* --------------------

// Re-export symbols object
module.exports = require('./lib/symbols');
// Exports
module.exports = require('./lib/symbols.js');
License

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

About

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc