Skip to content

Instantly share code, notes, and snippets.

@andrewgrewell
Created February 3, 2016 21:54
Show Gist options
  • Save andrewgrewell/b04b347c4d2783645285 to your computer and use it in GitHub Desktop.
Save andrewgrewell/b04b347c4d2783645285 to your computer and use it in GitHub Desktop.
React-Router 1.0.0+ async onEnter in IE7 fix
/*
Issue: If a component with an asyn onEnter (for example implementing a willTransitionTo type behavior) is rendered in IE7
React will throw an error about not being able to locate a dom node, (in this case it is the root route).
Reason: React-Router passes null to React while it is waiting for the async onEnter callback to be called. When React gets
a null value it instead renders an element with a tag of <noscript>. the <noscript> tag was not showing up in the element
that React was rendering into, not sure why this is though
Fix: instead of returning <noscript> return an empty <span>. We are using webpack so this was done by parsing the source
and specificly replacing the ReactInjection.EmptyComponent.injectEmptyComponent('noscript'); call
from ReactDefaultInjection.js
*/
if (/\/ReactDefaultInjection\.js?/.test(this.resourcePath)) {
source = source.replace(/ReactInjection\.EmptyComponent\.injectEmptyComponent\('noscript'\);/, 'ReactInjection.EmptyComponent.injectEmptyComponent(\'span\');');
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment