msn0 / mdn-polyfills Goto Github PK

Implement Object.entries polyfill as per https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind#Polyfill

Hello,

The implementation of MouseEvent doesn't match the one currently at : https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/MouseEvent

So ScreenX, ClientX, etc doesn't work ...

(function (window) {
  try {
    new MouseEvent('test');
    return false; // No need to polyfill
  } catch (e) {
		// Need to polyfill - fall through
  }

    // Polyfills DOM4 MouseEvent
	var MouseEventPolyfill = function (eventType, params) {
		params = params || { bubbles: false, cancelable: false };
		var mouseEvent = document.createEvent('MouseEvent');
		mouseEvent.initMouseEvent(eventType, 
			params.bubbles,
			params.cancelable,
			window,
			0,
			params.screenX || 0,
			params.screenY || 0,
			params.clientX || 0,
			params.clientY || 0,
			params.ctrlKey || false,
			params.altKey || false,
			params.shiftKey || false,
			params.metaKey || false,
			params.button || 0,
			params.relatedTarget || null
		);

		return mouseEvent;
	}

	MouseEventPolyfill.prototype = Event.prototype;

	window.MouseEvent = MouseEventPolyfill;
})(window);

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create

There is a small fault in the Node.prototype.before polyfill which results in a ErrorNotFound in IE11.

this.insertBefore(o, this) should be this.parentNode.insertBefore(o, this)

It has already been fixed on MDN: https://developer.mozilla.org/en-US/docs/Web/API/ChildNode/before

Polyfills to be released:

String.prototype.padStart
String.prototype.padEnd
CustomEvent

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat#Polyfill

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find#Polyfill

https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent#Polyfill

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex?v=example#Polyfill

import 'mdn-polyfills/Element.prototype.classList'; gets an error in IE9.
Unable to get property 'document' of undefined or null reference

Object.entries('s')
expected: [['0', 's']]
received: Error argument

Object.entries(100)
expected: []
received: Error argument

Is there any way we can have the Array.reduce polyfill from here:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce#Polyfill

Hello,

So there is a big discussion about how self executing functions or side effects are being shaked off when, for example, you directly import one poly fill.

Imagine the following scenario:

App A includes a component from module M.

Module M imports one of your polyfills P.

When webpack compiles A, as your module has no sideEffects in package.json, it simply thinks that P is dead code.

(A nice discussion can be followed at : webpack/webpack#6571)

What do you think of adding sideEffects to this library package.json?

Thank you!

Say I have a page with an inline SVG which contains a path element.

In Firefox if I do document.querySelector('path').closest('html') I'll get the HTML element.

But in IE11 with the polyfill currently in this repo, I get nothing. This is because parentElement isn't defined on SVG elements.

I notice that the polyfill in this repo doesn't match that on MDN. I guess it's been updated. The one currently on MDN has el.parentElement || el.parentNode in one spot, so I think this issue has been fixed there.

https://developer.mozilla.org/en-US/docs/Web/API/Element/closest#Polyfill

I was going to open a PR with the updated code, but noticed that this polyfill also polyfills Element.prototype.matches. With that in mind I'm not sure how the code for this repo should look. Should it import the Element.prototype.matches polyfill, and so rely on it as a dependency?

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach#Polyfill

Adding the 'Array.prototype.find' script - under IE11 - causes 'find' to be returned as a key when looping through any array, even an empty one.

var x = []; for( var key in x ) console.log(key);

The above code logs 'find' to the console, only when the shim is added however. I suspect looking at the code that other array shims will have a similar impact.

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith

Element.prototype.closest returns following error when used:

'ele' is undefined

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isNaN

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/includes

Implement a polyfill for String.prototype.padEnd as per https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padEnd#Polyfill

Implement Object.is polyfill as per https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is

https://developer.mozilla.org/pl/docs/Web/API/Element/closest

Implement a polyfill for String.prototype.padStart as per https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart#Polyfill

Hi, there is a bug in Element.classList.toggle.

First:
https://github.com/msn0/mdn-polyfills/blob/master/src/Element.prototype.classList/classList.js#L157 - this.remove(oldToken), there is no variable oldToken in this function, this is copy-paste from next method DOMTokenListProto.replace, there must be a "val" variable from arguments.

Second:
I replaced this.remove(oldToken) with this.remove(val) but this code is not work in Android 4.2
browser\webview (but it works in Chrome, for example), because expression "this.value" in Android 4.2 returns undefined, so className always added, but never removed.

I tried to submit bug into MDN documentation, but got: Sorry, entering a bug into the product Developer Documentation has been disabled.

Simple implementation in russian version of doc works, but not consider the second argument of "toggle" method https://developer.mozilla.org/ru/docs/Web/API/Element/classList

I'm attempting to use String.prototype.endsWith and noticed that it uses import/export. This ends up failing in IE11, which defeats the purpose of polyfilling IE.

Would be nice to have Object.values in this package, so I have all polyfills from a single library (I still support IE11)

In line 3, document.documentElement.contains only succeeds if the element is present in window.document. For a document instance parsed from a string using DOMParser.parseFromString it won't work. Is there a reason to have this check?

Create a very simple gh-pages with a list of supported polyfills along with usage examples and links to mdn website.

Link to MDN polyfill for element.classList:
https://developer.mozilla.org/en-US/docs/Web/API/Element/classList#Polyfill

Array.from() is a static function and not on the prototype.

Will the mdn-polyfills software be updated?