update browser list for custom elements (#179)

* update browser list for custom elements

* better

packages/core-web-example/src/index.js

@@ -6,9 +6,7 @@ import "@mrhenry/core-web/modules/Intl.~locale.fr-FR";
 var event = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
 console.log(event.toLocaleString('nl-BE', { timeZone: 'UTC' }));
 
-customElements.define('mr-x', class extends HTMLElement {
-
-})
+customElements.define('mr-x', class extends HTMLElement {});
 
 // ["@mrhenry/core-web", {
 // 	browsers: {

packages/core-web-generator/generate-webcomponents.js

@@ -282,9 +282,12 @@ async function generateCustomElements(mapping) {
 			edge: "<79",
 			edge_mob: "*",
 			firefox: "<63",
-			safari: "*",
+			safari: "<11",
 			ie: "*",
-			opera: "<64"
+			opera: "<64",
+			op_mob: "<46",
+			op_mini: "*",
+			samsung_mob: '<8'
 		},
 		detector: true
 	});

packages/core-web-tests/src/test_customElements.define.extends.js

@@ -0,0 +1,15 @@
+QUnit.skip('customElements.define with extends', function (assert) {
+	class TestElementExtender extends HTMLButtonElement {
+		foo() {
+			return 'baz';
+		}
+	}
+
+	customElements.define('test-element-extender', TestElementExtender, { extends: 'button' });
+	const fixture = document.getElementById('qunit-fixture');
+
+	fixture.innerHTML = '<button is="test-element-extender"></button>';
+
+	const el = fixture.querySelector('button');
+	assert.equal(el.foo(), 'baz');
+});

packages/core-web-tests/src/test_customElements.define.js

@@ -1,38 +1,38 @@
-QUnit.test("customElements.define", function(assert) {
+QUnit.test('customElements.define', function(assert) {
 	class TestElementA extends HTMLElement {
 		foo() {
-			return "baz";
+			return 'baz';
 		}
 	}
 
-	customElements.define("test-element-a", TestElementA);
-	const fixture = document.getElementById("qunit-fixture");
+	customElements.define('test-element-a', TestElementA);
+	const fixture = document.getElementById('qunit-fixture');
 
-	fixture.innerHTML = "<test-element-a></test-element-a>";
+	fixture.innerHTML = '<test-element-a></test-element-a>';
 
-	const el = fixture.querySelector("test-element-a");
-	assert.equal(el.foo(), "baz");
+	const el = fixture.querySelector('test-element-a');
+	assert.equal(el.foo(), 'baz');
 });
 
-QUnit.test("customElements.connectedCallback", function(assert) {
+QUnit.test('customElements.connectedCallback', function(assert) {
 	class TestElementB extends HTMLElement {
 		constructor() {
 			super();
 
-			this._content = "rendered content";
+			this._content = 'rendered content';
 		}
 
 		connectedCallback() {
-			this.innerHTML = this._content || "";
+			this.innerHTML = this._content || '';
 		}
 	}
 
-	customElements.define("test-element-b", TestElementB);
-	const fixture = document.getElementById("qunit-fixture");
+	customElements.define('test-element-b', TestElementB);
+	const fixture = document.getElementById('qunit-fixture');
 	const elStart = new TestElementB();
 
 	fixture.appendChild(elStart);
 
-	const elOut = fixture.querySelector("test-element-b");
-	assert.equal(elOut.innerHTML, "rendered content");
+	const elOut = fixture.querySelector('test-element-b');
+	assert.equal(elOut.innerHTML, 'rendered content');
 });

packages/core-web/helpers/__mapping.js

@@ -22933,9 +22933,12 @@ module.exports = [
       "edge": "<79",
       "edge_mob": "*",
       "firefox": "<63",
-      "safari": "*",
+      "safari": "<11",
       "ie": "*",
-      "opera": "<64"
+      "opera": "<64",
+      "op_mob": "<46",
+      "op_mini": "*",
+      "samsung_mob": "<8"
     },
     "detector": true
   },