8

This line of code worked perfectly last week: var datepickerIcon = component.find('datepicker').getElement();

Now I'm getting this error: [TypeError: component.find(...).getElement is not a function]

The component which elements I'm trying to get is this one: <ui:inputDate class='datepickerField' aura:id='datepicker' value=" {!v.datepickerDate}" displayDatePicker="true"/>

It's been a month since I don't make changes in the code so I'm guessing that could have something to do with the final Summer '16 release

1
  • After the Summer 16, I also face same issue
    – user33484
    Commented Jun 16, 2016 at 6:34

2 Answers 2

8

Under Lightning Locker your components can no longer access DOM elements belonging to another namespace. So you can find a reference to the component but you cannot get the DOM element corresponding to it.

3
  • Thanks, I just deactivated the Lightning Locker Critical Update and it works fine.
    – Guille
    Commented Jun 15, 2016 at 19:32
  • Glad I could help clarify - evidently this means that whatever you are doing with the DOM element will have to be done differently in time for when Locker goes mandatory.
    – Charles T
    Commented Jun 15, 2016 at 20:54
  • 3
    That time is fast approaching - deactivation is meant as a way for you to keep moving if you encounter issues/bugs/gaps on the Locker Service side and not to avoid fixing latent bugs in your code that violate long documented rules or security violations (e.g. unsafe use of eval() or inline JavaScript). Commented Jun 16, 2016 at 12:04
7

CharlesT is 100% correct - LS finally enforces what has always been a rule: "do not access the DOM created by components you do not own". This creates an implicit contract on code you do not control, from an author that has definitely not agreed to keep the private internals of their components static. This is basic encapsulation and a long standing software best practice in general. When you ignore this you are setting us all up for failure. Your code will break sometime and it's almost guaranteed this will happen when you least expect it. We live a multi author, push update world and the only way to insure trust is with string API contracts agreed to by both parties. You can also no longer .find().find() and reach into the component structure of another component. Trust is one of the key reasons we've developed Locker Service - not just for security.

What is your unsupportable approach actually trying to solve so we can help suggest a supported and maintainable alternate approach?

3
  • Just to clarify, does find().find() still work if it's all in the same namespace?
    – Charles T
    Commented Jun 16, 2016 at 17:46
  • I need to change the icon of the default aura ui:date datepicker
    – Guille
    Commented Jun 16, 2016 at 19:58
  • This will using Jasmine in the Lightning Testing Service (github.com/forcedotcom/LightningTestingService) way harder as many checks are on the elements. Commented Jun 8, 2017 at 13:57

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .