useLocation will break on IE11 without Event polyfill #73
Description
This issue is just to note that useLocation will break on IE11 without a polyfill for window.Event. even when <meta http-equiv="x-ua-compatible" content="IE=edge"> is already in head.
IE9, 10 and 11 will break right here when new Event('pushstate'); is run by calling history.push('/something') in your react app.
Line 9 in bc3760d
Object doesn't support this action
You need to polyfill window.Event which import '@babel/polyfill'; is not doing for you. So here goes what I've added to my polyfill.js
/**
* To detect you are in IE (for this case) by checking typeof(Event) which is
* 'function' for all except IE where it is 'object'.
* You can then safely polyfill the Event constructor using the approach above.
* In IE11 it seems to be safe to set window.Event = CustomEvent.
*/
(function() {
if (typeof window.Event === 'function') return false; //If not IE
function CustomEvent(event, params) {
params = params || {
bubbles: false,
cancelable: false,
detail: undefined,
};
var evt = document.createEvent('CustomEvent');
evt.initCustomEvent(
event,
params.bubbles,
params.cancelable,
params.detail
);
return evt;
}
CustomEvent.prototype = window.Event.prototype;
window.Event = CustomEvent;
})();The solution was provided here (accepted answer). Don't skip the comments.
https://stackoverflow.com/questions/26596123/internet-explorer-9-10-11-event-constructor-doesnt-work