Alaska Airlines
Error being thrown into the DOM when trying to create components via JavaScript #529
Replies: 2 comments 3 replies
-
|
New issue with similar performance feature request |
Beta Was this translation helpful? Give feedback.
-
|
TODO Items to address this:
|
Beta Was this translation helpful? Give feedback.
-
|
@jordanjones243 are these items something you are working on? |
Beta Was this translation helpful? Give feedback.
-
|
@blackfalcon I have been adding this test to components as I have worked on. Mainly, the form components have gotten them added to their draft PRs with the form validation work I have been doing. |
Beta Was this translation helpful? Give feedback.
-
|
@jordanjones243 can you please list here what components you have updated and what ones need to be updated? I have added a table to the discussion for tracking. |
Beta Was this translation helpful? Give feedback.
-
An issue was brought to my attention recently with creating an instance of
auro-popoverthrough JavaScript that likely can come up in other components:Basically, in most of our components, we have attributes that are applied to our custom elements. These attributes are usually initialized inside of our constructor and some are reflected onto the element in the DOM. Where the issue arises is when we try to create a component using the DOM (via JavaScript). An error is thrown because the DOM is complaining that it cannot create an element that already has attributes applied to it. In this case, we had our
auro-popovercomponent being created with anidattribute already being assigned a value in the constructor.What we need to do is go through all of our components and move all of our attributes that are being reflected onto the components from being initialized in the constructor to the
connectedCallback()function, which runs once an element is attached to the DOM.This simple change from
auro-popovercan be used as a guide to make the change in any other component that can run into this issue:Beta Was this translation helpful? Give feedback.
All reactions