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

  • After the Summer 16, I also face same issue – user33484 Jun 16 '16 at 6:34
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.

  • Thanks, I just deactivated the Lightning Locker Critical Update and it works fine. – Guille Jun 15 '16 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 Jun 15 '16 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). – Doug Chasman Jun 16 '16 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?

  • Just to clarify, does find().find() still work if it's all in the same namespace? – Charles T Jun 16 '16 at 17:46
  • I need to change the icon of the default aura ui:date datepicker – Guille Jun 16 '16 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. – Robert Sösemann Jun 8 '17 at 13:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.