Embed Managed Aura component inside LWC

Question

Is there a way to embed an Aura Managed component inside an LWC? The reason is that the aura component shows me which image is currently selected, and I can get the "src" by querying the class ".is-selected" but I can't access any element if it's not in the same LWC. I tried to query by using document.querySelector('.is-current'); but it doesn't work because the LWC can't access anything from the Aura component in the record page.

So the question is, how can i have an LWC that loads the managed Aura component inside, so that i can use the document.querySelector('is-current'); or template.querySelector('is-current');

If this is not possible, is there a way to access the element that is in the record page from another LWC?

Answer 1

No. This is an X-Y Problem. You can't access the DOM of any other component, even child components, even if they're in the same namespace, unless you have that component configured as a Light DOM element. Further, you definitely can't access the component's DOM if that component is in a different namespace. Even further, you can't embed an Aura component in a LWC successfully; once you're in LWC space, it must be LWC all the way down. Placing an Aura component in a LWC slot is not allowed.

So, unfortunately, if that component isn't built with some kind of method to access that data, you can't access it programmatically. This is an intentional design choice so that multiple developers can have their components running in the same physical DOM without leaking data. In other words, it's a security feature to keep Salesforce secure despite developers being able to run their own JavaScript inside Salesforce. You'll need to contact the support team for the component, and see what solutions they can offer to you.