Fixes server rendering of jobs to respect work per element instance, not per component instance. Work is not shared.

Author: ctrlplusb

src/JobProvider.js

@@ -7,6 +7,7 @@ class JobProvider extends Component {
     children: PropTypes.node.isRequired,
     jobContext: PropTypes.shape({
       getNextId: PropTypes.func.isRequired,
+      resetIds: PropTypes.func.isRequired,
       register: PropTypes.func.isRequired,
       get: PropTypes.func.isRequired,
       getState: PropTypes.func.isRequired,
@@ -33,6 +34,17 @@ class JobProvider extends Component {
     }).isRequired,
   };
 
+  constructor(props, context) {
+    super(props, context)
+
+    // This is a workaround because each element instance of a job needs its
+    // own ids.  So between the bootstrapping and the render we need to reset
+    // the id counter to ensure the ids will match.
+    if (props.jobContext) {
+      props.jobContext.resetIds()
+    }
+  }
+
   componentWillMount() {
     this.jobContext = this.props.jobContext || createJobContext()
     this.rehydrateState = this.props.rehydrateState

src/createJobContext.js

@@ -6,6 +6,9 @@ export default function createJobContext() {
       idPointer += 1
       return idPointer
     },
+    resetIds: () => {
+      idPointer = 0
+    },
     register: (jobID, result) => {
       jobs[jobID] = result
     },

src/withJob.js

@@ -46,7 +46,9 @@ export default function withJob(config) {
       constructor(props, context) {
         super(props, context)
 
-        if (context.jobs && !id) {
+        // Each instance needs it's own id as that is how we expect work to
+        // be executed.  It is not shared between element instances.
+        if (context.jobs) {
           id = context.jobs.getNextId()
         }
       }