Fix tests in IE11

compat/test/browser/events.test.js

@@ -28,7 +28,20 @@ describe('preact/compat events', () => {
 	});
 
 	it('should patch events', () => {
-		let spy = sinon.spy();
+		let spy = sinon.spy(event => {
+			// Calling ev.preventDefault() outside of an event handler
+			// does nothing in IE11. So we move these asserts inside
+			// the event handler. We ensure that it's called once
+			// in another assertion
+			expect(event.isDefaultPrevented()).to.be.false;
+			event.preventDefault();
+			expect(event.isDefaultPrevented()).to.be.true;
+
+			expect(event.isPropagationStopped()).to.be.false;
+			event.stopPropagation();
+			expect(event.isPropagationStopped()).to.be.true;
+		});
+
 		render(<div onClick={spy} />, scratch);
 		scratch.firstChild.click();
 
@@ -45,14 +58,6 @@ describe('preact/compat events', () => {
 		expect(() => event.persist()).to.not.throw();
 		expect(() => event.isDefaultPrevented()).to.not.throw();
 		expect(() => event.isPropagationStopped()).to.not.throw();
-
-		expect(event.isDefaultPrevented()).to.be.false;
-		event.preventDefault();
-		expect(event.isDefaultPrevented()).to.be.true;
-
-		expect(event.isPropagationStopped()).to.be.false;
-		event.stopPropagation();
-		expect(event.isPropagationStopped()).to.be.true;
 	});
 
 	it('should normalize ondoubleclick event', () => {

compat/test/browser/textarea.test.js

@@ -20,6 +20,10 @@ describe('Textarea', () => {
 	});
 
 	it('should alias defaultValue to children', () => {
+		// TODO: IE11 doesn't update `node.value` when
+		// `node.defaultValue` is set.
+		if (/Trident/.test(navigator.userAgent)) return;
+
 		render(<textarea defaultValue="foo" />, scratch);
 
 		expect(scratch.firstElementChild.value).to.equal('foo');
@@ -43,7 +47,12 @@ describe('Textarea', () => {
 		// missing from HTML because innerHTML doesn't serialize form field values.
 		// See demo: https://jsfiddle.net/4had2Lu8
 		// Related renderToString PR: preactjs/preact-render-to-string#161
-		expect(scratch.innerHTML).to.equal('<textarea></textarea>');
+		//
+		// This is not true for IE11. It displays the value in
+		// node.innerHTML regardless.
+		if (!/Trident/.test(window.navigator.userAgent)) {
+			expect(scratch.innerHTML).to.equal('<textarea></textarea>');
+		}
 		expect(scratch.firstElementChild.value).to.equal('hello');
 
 		act(() => {

test/browser/hydrate.test.js

@@ -193,7 +193,11 @@ describe('hydrate()', () => {
 		clearLog();
 		hydrate(vnode, scratch);
 
-		expect(attributesSpy.get).to.not.have.been.called;
+		// IE11 doesn't support spying on Element.prototype
+		if (!/Trident/.test(navigator.userAgent)) {
+			expect(attributesSpy.get).to.not.have.been.called;
+		}
+
 		expect(serializeHtml(scratch)).to.equal(
 			sortAttributes(
 				'<div><span before-hydrate="test" different-value="a" same-value="foo">Test</span></div>'
@@ -345,7 +349,10 @@ describe('hydrate()', () => {
 		);
 
 		hydrate(preactElement, scratch);
-		expect(attributesSpy.get).to.not.have.been.called;
+		// IE11 doesn't support spies on built-in prototypes
+		if (!/Trident/.test(navigator.userAgent)) {
+			expect(attributesSpy.get).to.not.have.been.called;
+		}
 		expect(scratch).to.have.property(
 			'innerHTML',
 			'<div><a foo="bar"></a></div>'
@@ -400,8 +407,10 @@ describe('hydrate()', () => {
 		};
 
 		hydrate(<App />, scratch);
-		expect(scratch.innerHTML).to.equal(
-			'<select><option value="0">Zero</option><option selected="" value="2">Two</option></select>'
+		expect(sortAttributes(scratch.innerHTML)).to.equal(
+			sortAttributes(
+				'<select><option value="0">Zero</option><option selected="" value="2">Two</option></select>'
+			)
 		);
 	});
 

test/browser/render.test.js

@@ -24,6 +24,8 @@ function getAttributes(node) {
 	return attrs;
 }
 
+const isIE11 = /Trident\//.test(navigator.userAgent);
+
 describe('render()', () => {
 	let scratch, rerender;
 
@@ -130,7 +132,7 @@ describe('render()', () => {
 		const input = div.childNodes[2];
 
 		// IE11 doesn't support the form attribute
-		if (!/(Trident)/.test(navigator.userAgent)) {
+		if (!isIE11) {
 			expect(button).to.have.property('form', form);
 			expect(input).to.have.property('form', form);
 		}
@@ -1068,7 +1070,6 @@ describe('render()', () => {
 
 	it('should not read DOM attributes on render without existing DOM', () => {
 		const attributesSpy = spyOnElementAttributes();
-
 		render(
 			<div id="wrapper">
 				<div id="page1">Page 1</div>
@@ -1078,7 +1079,12 @@ describe('render()', () => {
 		expect(scratch.innerHTML).to.equal(
 			'<div id="wrapper"><div id="page1">Page 1</div></div>'
 		);
-		expect(attributesSpy.get).to.not.have.been.called;
+
+		// IE11 doesn't allow modifying Element.prototype functions properly.
+		// Custom spies will never be called.
+		if (!isIE11) {
+			expect(attributesSpy.get).to.not.have.been.called;
+		}
 
 		render(
 			<div id="wrapper">
@@ -1089,6 +1095,11 @@ describe('render()', () => {
 		expect(scratch.innerHTML).to.equal(
 			'<div id="wrapper"><div id="page2">Page 2</div></div>'
 		);
-		expect(attributesSpy.get).to.not.have.been.called;
+
+		// IE11 doesn't allow modifying Element.prototype functions properly.
+		// Custom spies will never be called.
+		if (!isIE11) {
+			expect(attributesSpy.get).to.not.have.been.called;
+		}
 	});
 });

test/polyfills.js

@@ -13,6 +13,12 @@ import 'core-js/fn/string/from-code-point';
 import 'core-js/fn/string/repeat';
 import * as kl from 'kolorist';
 
+// Something that's loaded before this file polyfills Symbol object.
+// We need to verify that it works in IE without that.
+if (/Trident/.test(window.navigator.userAgent)) {
+	window.Symbol = undefined;
+}
+
 // Fix Function#name on browsers that do not support it (IE).
 // Taken from: https://stackoverflow.com/a/17056530/755391
 if (!function f() {}.name) {