diff --git a/src/browser/ui/dom/HTMLDOMPropertyConfig.js b/src/browser/ui/dom/HTMLDOMPropertyConfig.js
index 2309cf078386..268c963646d9 100644
--- a/src/browser/ui/dom/HTMLDOMPropertyConfig.js
+++ b/src/browser/ui/dom/HTMLDOMPropertyConfig.js
@@ -21,6 +21,7 @@
"use strict";
var DOMProperty = require('DOMProperty');
+var ExecutionEnvironment = require('ExecutionEnvironment');
var MUST_USE_ATTRIBUTE = DOMProperty.injection.MUST_USE_ATTRIBUTE;
var MUST_USE_PROPERTY = DOMProperty.injection.MUST_USE_PROPERTY;
@@ -32,6 +33,20 @@ var HAS_POSITIVE_NUMERIC_VALUE =
var HAS_OVERLOADED_BOOLEAN_VALUE =
DOMProperty.injection.HAS_OVERLOADED_BOOLEAN_VALUE;
+var hasSVG;
+if (ExecutionEnvironment.canUseDOM) {
+ var implementation = document.implementation;
+ hasSVG = (
+ implementation &&
+ implementation.hasFeature &&
+ implementation.hasFeature(
+ 'http://www.w3.org/TR/SVG11/feature#BasicStructure',
+ '1.1'
+ )
+ );
+}
+
+
var HTMLDOMPropertyConfig = {
isCustomAttribute: RegExp.prototype.test.bind(
/^(data|aria)-[a-z_][a-z\d_.\-]*$/
@@ -55,7 +70,12 @@ var HTMLDOMPropertyConfig = {
cellSpacing: null,
charSet: MUST_USE_ATTRIBUTE,
checked: MUST_USE_PROPERTY | HAS_BOOLEAN_VALUE,
- className: MUST_USE_PROPERTY,
+ // To set className on SVG elements, it's necessary to use .setAttribute;
+ // this works on HTML elements too in all browsers except IE8. Conveniently,
+ // IE8 doesn't support SVG and so we can simply use the attribute in
+ // browsers that support SVG and the property in browsers that don't,
+ // regardless of whether the element is HTML or SVG.
+ className: hasSVG ? MUST_USE_ATTRIBUTE : MUST_USE_PROPERTY,
cols: MUST_USE_ATTRIBUTE | HAS_POSITIVE_NUMERIC_VALUE,
colSpan: null,
content: null,