const React = require('react');
const { renderToStaticMarkup } = require('react-dom/server');

const JSON_ESCAPE = {
  '&': '\\u0026',
  '>': '\\u003e',
  '<': '\\u003c',
  '\u2028': '\\u2028',
  '\u2029': '\\u2029'
};

const JSON_ESCAPE_REGEXP = /[\u2028\u2029&><]/g;

function escapeJSONString(value) {
  return value.replace(JSON_ESCAPE_REGEXP, match => JSON_ESCAPE[match]);
}

function escapedJSONStringify(obj) {
  return escapeJSONString(JSON.stringify(obj));
}

const data = "</script><script>console.log('hejsan2')</script><script>";

// outputs: <script type="application/ld+json">"</script><script>console.log('hejsan2')</script><script>"</script>
// which won't parse as expected + will log 'hejsan2' to the console
console.log(renderToStaticMarkup(React.createElement('script', {
  type: 'application/ld+json',
  dangerouslySetInnerHTML: { __html: `${JSON.stringify(data)}` }
})));

// outputs: <script type="application/ld+json">"\u003c/script\u003e\u003cscript\u003econsole.log('hejsan2')\u003c/script\u003e\u003cscript\u003e"</script>
// which can be parsed as expected + won't log anything
// parsing it: JSON.parse(`"\u003c/script\u003e\u003cscript\u003econsole.log('hejsan2')\u003c/script\u003e\u003cscript\u003e"`)
// results in: "</script><script>console.log('hejsan2')</script><script>"
console.log(renderToStaticMarkup(React.createElement('script', {
  type: 'application/ld+json',
  dangerouslySetInnerHTML: { __html: `${escapedJSONStringify(data)}` }
})));