Feature: Put some data inside the script tag [closes #8]

README.md

@@ -27,7 +27,10 @@ URL pointing to the script you want to load.
 ### `attributes`
 An object used to define custom attributes to be set on the script element. For example, `attributes={{ id: 'someId', 'data-custom: 'value' }}` will result in `<script id="someId" data-custom="value" />`
 
-## Example
+### `children`
+What is set as children of `<Script>` gets inserted inside the script tag. This can be used to set settings for the script
+
+## Examples
 You can use the following code to load jQuery in your app:
 
 ```jsx
@@ -62,6 +65,30 @@ handleScriptLoad() {
 
 ```
 
+Code to set some content inside the script tag:
+
+```jsx
+import Script from 'react-load-script'
+
+...
+
+render() {
+  return (
+    <Script
+      url="//platform.linkedin.com/in.js"
+      onError={() => {}}
+      onLoad={() => {}}
+    >
+      lang: en_US
+    </Script>
+  )
+}
+
+...
+
+```
+
+
 ## License
 MIT 2016
 

package.json

@@ -42,8 +42,8 @@
     "jest": "19.0.2",
     "prop-types": "15.5.8",
     "react": "15.5.4",
-    "react-addons-test-utils": "15.5.1",
     "react-dom": "15.5.4",
+    "react-test-renderer": "^15.6.1",
     "rimraf": "2.4.3"
   },
   "dependencies": {},

src/index.jsx

@@ -9,13 +9,15 @@ export default class Script extends React.Component {
     onError: RPT.func.isRequired,
     onLoad: RPT.func.isRequired,
     url: RPT.string.isRequired,
+    children: RPT.string,
   };
 
   static defaultProps = {
     attributes: {},
     onCreate: () => {},
     onError: () => {},
     onLoad: () => {},
+    children: undefined,
   }
 
   // A dictionary mapping script URLs to a dictionary mapping
@@ -78,7 +80,7 @@ export default class Script extends React.Component {
   }
 
   createScript() {
-    const { onCreate, url, attributes } = this.props;
+    const { onCreate, url, attributes, children } = this.props;
     const script = document.createElement('script');
 
     onCreate();
@@ -95,6 +97,11 @@ export default class Script extends React.Component {
       script.async = 1;
     }
 
+    // put data inside the script tag, so script can use them (linkedin share use case)
+    if (children) {
+      script.innerHTML = children;
+    }
+
     const callObserverFuncAndRemoveObserver = (shouldRemoveObserver) => {
       const observers = this.constructor.scriptObservers[url];
       Object.keys(observers).forEach((key) => {

src/index.test.jsx

@@ -20,7 +20,7 @@ beforeEach(() => {
       async: false,
     },
   };
-  wrapper = shallow(<Script {...props} />);
+  wrapper = shallow(<Script {...props}>data</Script>);
 });
 
 test('renders null', () => {
@@ -91,3 +91,8 @@ test('custom attributes should be set on the script tag', () => {
   expect(script.getAttribute('data-dummy')).toBe('standard');
   expect(script.getAttribute('async')).toBe('false');
 });
+
+test('content inside script tag', () => {
+  const script = document.getElementById('dummyId');
+  expect(script.innerHTML).toBe('data');
+});

yarn.lock

@@ -1618,7 +1618,7 @@ fb-watchman@^2.0.0:
   dependencies:
     bser "^2.0.0"
 
-fbjs@^0.8.4, fbjs@^0.8.9:
+fbjs@^0.8.9:
   version "0.8.12"
   resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.12.tgz#10b5d92f76d45575fd63a217d4ea02bea2f8ed04"
   dependencies:
@@ -3069,13 +3069,6 @@ rc@^1.1.7:
     minimist "^1.2.0"
     strip-json-comments "~2.0.1"
 
-[email protected]:
-  version "15.5.1"
-  resolved "https://registry.yarnpkg.com/react-addons-test-utils/-/react-addons-test-utils-15.5.1.tgz#e0d258cda2a122ad0dff69f838260d0c3958f5f7"
-  dependencies:
-    fbjs "^0.8.4"
-    object-assign "^4.1.0"
-
 [email protected]:
   version "15.5.4"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-15.5.4.tgz#ba0c28786fd52ed7e4f2135fe0288d462aef93da"
@@ -3085,6 +3078,13 @@ [email protected]:
     object-assign "^4.1.0"
     prop-types "~15.5.7"
 
+react-test-renderer@^15.6.1:
+  version "15.6.1"
+  resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-15.6.1.tgz#026f4a5bb5552661fd2cc4bbcd0d4bc8a35ebf7e"
+  dependencies:
+    fbjs "^0.8.9"
+    object-assign "^4.1.0"
+
 [email protected]:
   version "15.5.4"
   resolved "https://registry.yarnpkg.com/react/-/react-15.5.4.tgz#fa83eb01506ab237cdc1c8c3b1cea8de012bf047"