@sequencemedia/react-redux-render 2.1.0 → 2.2.1

package/{babel.config.js → babel.config.cjs}

@@ -1,6 +1,4 @@
 module.exports = {
-  compact: true,
-  comments: false,
   presets: [
     [
       '@babel/env', {
@@ -12,10 +10,5 @@ module.exports = {
       }
     ],
     '@babel/react'
-  ],
-  plugins: [
-    '@babel/transform-runtime',
-    '@babel/proposal-export-default-from',
-    '@babel/proposal-export-namespace-from'
   ]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sequencemedia/react-redux-render",
-  "version": "2.1.0",
+  "version": "2.2.1",
   "description": "React Render",
   "keywords": [
     "React",
@@ -10,7 +10,8 @@
     "renderToString",
     "renderToStaticMarkup"
   ],
-  "main": "./index.js",
+  "type": "module",
+  "main": "./src/index.mjs",
   "author": {
     "name": "Jonathan Perry for Sequence Media Limited",
     "email": "jonathanperry@sequencemedia.net",
@@ -18,41 +19,30 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">=16.13.0"
+    "node": ">=18.5.0"
   },
   "repository": {
     "type": "git",
     "url": "git://github.com/sequencemedia/react-redux-render.git"
   },
   "scripts": {
-    "build": "npm run babel",
-    "build:watch": "npm run babel:watch",
-    "babel": "babel src -d lib",
-    "babel:watch": "npm run babel -- -w",
-    "clean": "rimraf lib",
-    "prepublishOnly": "npm run build",
-    "prebuild": "npm run clean",
-    "lint": "eslint .",
+    "test": "NODE_ENV=test mocha test --recursive --verbose",
+    "lint": "eslint . --ext .cjs --ext .mjs",
     "lint:fix": "npm run lint -- --fix",
     "prepare": "husky install"
   },
   "dependencies": {
-    "@babel/runtime": "^7.21.5",
     "@hapi/boom": "^10.0.1",
     "debug": "^4.3.4"
   },
   "devDependencies": {
-    "@babel/cli": "^7.21.5",
     "@babel/core": "^7.21.8",
     "@babel/eslint-parser": "^7.21.8",
-    "@babel/plugin-proposal-export-default-from": "^7.18.10",
-    "@babel/plugin-proposal-export-namespace-from": "^7.18.9",
-    "@babel/plugin-proposal-throw-expressions": "^7.18.6",
-    "@babel/plugin-transform-runtime": "^7.21.4",
     "@babel/preset-env": "^7.21.5",
     "@babel/preset-react": "^7.18.6",
     "@babel/register": "^7.21.0",
     "@sequencemedia/hooks": "^1.0.423",
+    "chai": "^4.3.7",
     "core-js": "^3.30.2",
     "eslint": "^8.41.0",
     "eslint-config-standard": "^17.0.0",
@@ -61,10 +51,16 @@
     "eslint-plugin-promise": "^6.1.1",
     "eslint-plugin-react": "^7.32.2",
     "husky": "^8.0.3",
+    "mocha": "^10.2.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-redux": "^8.0.5",
     "redux": "^4.2.1",
-    "rimraf": "^5.0.1"
+    "rimraf": "^5.0.1",
+    "sinon": "^15.1.0",
+    "sinon-chai": "^3.7.0"
+  },
+  "exports": {
+    ".": "./src/index.mjs"
   }
 }

package/src/index.mjs

@@ -0,0 +1,38 @@
+/**
+ * @typedef {import('redux').Store} Store
+ */
+
+import debug from 'debug'
+
+import {
+  getReactDOMServerRenderToString,
+  getReactDOMServerRenderToStaticMarkup
+} from './react-dom-server.cjs'
+
+const log = debug('@sequencemedia/react-redux-render')
+
+log('`react-redux-render` is awake')
+
+/**
+ * @param {Store} store
+ * @param {React.ReactElement} Component
+ * @param {Object.<string, any>} props
+ * @returns {string}
+ */
+export const renderToString = (store, Component, props = {}) => getReactDOMServerRenderToString(store, Component, props)
+
+/**
+ * @param {Store} store
+ * @param {React.ReactElement} Component
+ * @param {Object.<string, any>} props
+ * @returns {string}
+ */
+export const renderToStaticMarkup = (store, Component, props = {}) => getReactDOMServerRenderToStaticMarkup(store, Component, props)
+
+/**
+ * @param {Store} store
+ * @param {React.ReactElement} Component
+ * @param {Object.<string, any>} props
+ * @returns {Promise<string>}
+ */
+export const render = async (store, Component, props = {}) => getReactDOMServerRenderToString(store, Component, props)

package/src/react-dom-server.cjs

@@ -0,0 +1,9 @@
+require('@babel/register')
+
+const {
+  getReactDOMServerRenderToString,
+  getReactDOMServerRenderToStaticMarkup
+} = require('./react-dom-server.jsx')
+
+module.exports.getReactDOMServerRenderToString = getReactDOMServerRenderToString
+module.exports.getReactDOMServerRenderToStaticMarkup = getReactDOMServerRenderToStaticMarkup

package/src/{index.js → react-dom-server.jsx}

@@ -1,16 +1,31 @@
+/**
+ * @typedef {import('redux').Store} Store
+ */
+
+import debug from 'debug'
 import React from 'react'
 import ReactDOMServer from 'react-dom/server'
 import Boom from '@hapi/boom'
 import { Provider } from 'react-redux'
-import debug from 'debug'
 
 const log = debug('@sequencemedia/react-redux-render')
 
 log('`react-redux-render` is awake')
 
+/**
+ * @param {Error} e
+ * @param {{props: Object.<string, any>}} data
+ * @returns A boom object
+ */
 const badImplementation = (e, data) => Boom.boomify(e, { statusCode: 500, message: 'Rendering exception', data })
 
-function getReactDOMServerRenderToString (store, Component, props) {
+/**
+ * @param {Store} store
+ * @param {React.ReactElement} Component
+ * @param {Object.<string, any>} props
+ * @returns {string}
+ */
+export function getReactDOMServerRenderToString (store, Component, props) {
   try {
     return ReactDOMServer.renderToString(
       <Provider store={store}>
@@ -26,7 +41,13 @@ function getReactDOMServerRenderToString (store, Component, props) {
   }
 }
 
-function getReactDOMServerRenderToStaticMarkup (store, Component, props) {
+/**
+ * @param {Store} store
+ * @param {React.ReactElement} Component
+ * @param {Object.<string, any>} props
+ * @returns {string}
+ */
+export function getReactDOMServerRenderToStaticMarkup (store, Component, props) {
   try {
     return ReactDOMServer.renderToStaticMarkup(
       <Provider store={store}>
@@ -41,18 +62,3 @@ function getReactDOMServerRenderToStaticMarkup (store, Component, props) {
     throw badImplementation(e, { props })
   }
 }
-
-/**
- * @return {string}
- */
-export const renderToString = (store, Component, props = {}) => getReactDOMServerRenderToString(store, Component, props)
-
-/**
- * @return {string}
- */
-export const renderToStaticMarkup = (store, Component, props = {}) => getReactDOMServerRenderToStaticMarkup(store, Component, props)
-
-/**
- * @return {Promise<string>}
- */
-export const render = async (store, Component, props = {}) => getReactDOMServerRenderToString(store, Component, props)

package/test/component.cjs

@@ -0,0 +1,7 @@
+require('@babel/register')
+
+const {
+  default: component
+} = require('./component.jsx')
+
+module.exports = component

package/test/component.jsx

@@ -0,0 +1,13 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+
+function Component ({ content }) {
+  if (content) return <h1>Component {content}</h1>
+  return <h1>Component</h1>
+}
+
+Component.propTypes = {
+  content: PropTypes.string
+}
+
+export default Component

package/test/index.spec.mjs

@@ -0,0 +1,88 @@
+import chai, { expect } from 'chai'
+import sinonChai from 'sinon-chai'
+
+import {
+  renderToString,
+  renderToStaticMarkup,
+  render
+} from '@sequencemedia/react-redux-render'
+
+import Component from './component.cjs'
+
+chai.use(sinonChai)
+
+describe('react-render', () => {
+  describe('`renderToString`', () => {
+    it('is a function', () => {
+      return expect(renderToString)
+        .to.be.a('function')
+    })
+  })
+
+  describe('`renderToStaticMarkup`', () => {
+    it('is a function', () => {
+      return expect(renderToStaticMarkup)
+        .to.be.a('function')
+    })
+  })
+
+  describe('`render`', () => {
+    it('is a function', () => {
+      return expect(render)
+        .to.be.a('function')
+    })
+  })
+
+  describe('With props', () => {
+    const store = { getState () { return {} } }
+    const props = {
+      content: 'MOCK CONTENT'
+    }
+
+    describe('`renderToString()`', () => {
+      it('returns a string', () => {
+        return expect(renderToString(store, Component, props))
+          .to.equal('<h1>Component <!-- -->MOCK CONTENT</h1>')
+      })
+    })
+
+    describe('`renderToStaticMarkup()`', () => {
+      it('returns a string', () => {
+        return expect(renderToStaticMarkup(store, Component, props))
+          .to.equal('<h1>Component MOCK CONTENT</h1>')
+      })
+    })
+
+    describe('`render()`', () => {
+      it('returns a Promise resolving to a string', async () => {
+        return expect(await render(store, Component, props))
+          .to.equal('<h1>Component <!-- -->MOCK CONTENT</h1>')
+      })
+    })
+  })
+
+  describe('Without props', () => {
+    const store = { getState () { return {} } }
+
+    describe('`renderToString()`', () => {
+      it('returns a string', () => {
+        return expect(renderToString(store, Component))
+          .to.equal('<h1>Component</h1>')
+      })
+    })
+
+    describe('`renderToStaticMarkup()`', () => {
+      it('returns a string', () => {
+        return expect(renderToStaticMarkup(store, Component))
+          .to.equal('<h1>Component</h1>')
+      })
+    })
+
+    describe('`render()`', () => {
+      it('returns a Promise resolving to a string', async () => {
+        return expect(await render(store, Component))
+          .to.equal('<h1>Component</h1>')
+      })
+    })
+  })
+})

package/.gitattributes

@@ -1,20 +0,0 @@
-# Default behavior
-* text=auto
-
-# LF line endings
-*.json text eol=lf
-*.mjs text eol=lf
-*.cjs text eol=lf
-*.mts text eol=lf
-*.js text eol=lf
-*.ts text eol=lf
-*.sh text eol=lf
-.editorconfig text eol=lf
-.eslintignore text eol=lf
-.eslintrc text eol=lf
-.gitattributes text eol=lf
-.gitignore text eol=lf
-.npmignore text eol=lf
-.npmrc text eol=lf
-.nvmrc text eol=lf
-.husky/* text eol=lf

package/index.js

@@ -1,2 +0,0 @@
-//
-module.exports = require('./lib')