Skip to content

HTMLElement.style is readonly #44

@willglynn

Description

@willglynn

I noticed the REPL wasn't working in Safari 10.0.1 (11602.2.14.0.7). Execution gets to:

function renderMainFragment ( root, component, target ) {
	var div = document.createElement( 'div' );
	div.setAttribute( 'svelte-1546246679', '' );
	div.className = "left";
	div.style = "width: " + ( root.verticalDividerPos ) + "%;";

…where it blows up with TypeError: Attempted to assign to readonly property.

This error appears to agree with the specs. CSS Object Model Level 2 defines the element style attribute to be readonly, offering mutability via the CSSStyleDeclaration provided by the style attribute rather than the style attribute itself. HTML5's global style attribute definition references CSSOM for the style IDL instead of explicitly stating it, though it includes a non-normative section describing style as having a getter with no setter:

element.style
Returns a CSSStyleDeclaration object for the element's style attribute.

MDN's style page describes "Setting style" as a thing which one can do, but explains that this is really just shorthand:

Styles can be set by assigning a string directly to the style property (as in elt.style = "color: blue;" ), which forwards it as el.style.cssText = "color:blue;", though it returns a CSSStyleDeclaration object which is read-only.

Probably this code should say .style.cssText="" instead of .style="".

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions