Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

element.style[key] = value throws implicit any error #11914

Closed
appsforartists opened this issue Oct 28, 2016 · 6 comments
Closed

element.style[key] = value throws implicit any error #11914

appsforartists opened this issue Oct 28, 2016 · 6 comments
Labels
Duplicate An existing issue was already created

Comments

@appsforartists
Copy link

TypeScript Version: 2.0.3

Code

const propName: string = 'position';

const div = document.getElementsByTagName('div')[0];
div.style[propName] = 'absolute';

Expected behavior:
Styles are dynamically settable with dictionary access; the above snippet should set position: absolute on div

Actual behavior:
Throws

ERROR(4,1): : Element implicitly has an 'any' type because index expression is not of type 'number'.

Must use format style.setProperty(key, value);

@aluanhaddad
Copy link
Contributor

This behavior is correct. Specifically, element.style is typed as a CSSStyleDeclaration which is declared in lib.dom.d.ts as

interface CSSStyleDeclaration {
    [index: number]: string;
}

@akarzazi
Copy link

From W3C : https://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSStyleDeclaration


// Introduced in DOM Level 2:
interface CSSStyleDeclaration {
           attribute DOMString        cssText;
                                        // raises(DOMException) on setting

  DOMString          getPropertyValue(in DOMString propertyName);
  CSSValue           getPropertyCSSValue(in DOMString propertyName);
  DOMString          removeProperty(in DOMString propertyName)
                                        raises(DOMException);
  DOMString          getPropertyPriority(in DOMString propertyName);
  void               setProperty(in DOMString propertyName, 
                                 in DOMString value, 
                                 in DOMString priority)
                                        raises(DOMException);
  readonly attribute unsigned long    length;
  DOMString          item(in unsigned long index);
  readonly attribute CSSRule          parentRule;
};

There is no string indexer on CSSStyleDeclaration.
The statement : div.style["position"] is a JavaScript alternative way to access the property div.style.position, which is not possible in TypeScript.

@mhegazy
Copy link
Contributor

mhegazy commented Oct 30, 2016

The statement : div.style["position"] is a JavaScript alternative way to access the property div.style.position, which is not possible in TypeScript.

This is not accurate. both div.style["position"] and div.style.position work as intended. both resolve to the same property and both have the type string.

This is another manifestation of #7730 which is basically that:

const position = "position";
div.style[position] // should behave the same way as div.style["position"]

@mhegazy mhegazy added the Duplicate An existing issue was already created label Oct 30, 2016
@mhegazy
Copy link
Contributor

mhegazy commented Oct 30, 2016

this should be handled correctelly when #11929 is merged in.

@mhegazy
Copy link
Contributor

mhegazy commented Oct 30, 2016

closing in favor of #7730.

@mhegazy mhegazy closed this as completed Oct 30, 2016
@akarzazi
Copy link

My bad, TypeScript seems to handle index notation fine as long as the parameter is a string literal !

const div = document.getElementsByTagName('div')[0];
var a = div.style['position']; // a is string|null;

@microsoft microsoft locked and limited conversation to collaborators Jun 19, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Duplicate An existing issue was already created
Projects
None yet
Development

No branches or pull requests

4 participants