'AdsDisplayContainer' elements inside of a shadow DOM

[Noa Vitenshtein]

Hi,

I'm using the 'AdsDisplayContainer' elements inside a shadow DOM, the ads are playing properly but I'm getting the following error to the console:

`Uncaught DOMException: Blocked a frame with origin "http://imasdk.googleapis.com" from accessing a cross-origin frame.`

Without the shadow DOM, there is no error.

How can I fix this error?

When using a shadow dom there is some other configuration that needs to be added? 

Thanks,

Noa Vitenshtein 

[IMA SDK]

Hi Noa,

Thank you for bringing up with us this issue with having an error message in console when using a shadow DOM -  "Blocked a frame with origin "http://imasdk.googleapis.com" from accessing a cross-origin frame".`I replicated this issue in a sample demonstration app. To ensure your implementation is the same, could you host a sample based on one of our sample apps with minimum modification for shadow DOM that demonstrates this issue?

Regards,

Aryeh Baker IMA SDK Team

 

ref:_00D1U1174p._5004Q2DIto2:ref

[Noa Vitenshtein]

Hi,

Thanks for the fast response.

I hosted a sample based on the simple folder from the sample apps, with a shadow DOM wrapper. This sample demonstrates the issue.

https://kingerez.github.io/ima-shadowroot/

The source code:

https://github.com/kingerez/ima-shadowroot

Regards,

Noa Vitenshtein

[IMA SDK]

Hi Noa,

I’m with Aryeh’s team so let me assist you today. Thanks for sharing this sample with us for our reference. On the other hand, I also received an update and a workaround from the team regarding this issue. It is noted that instead of having the ad container exist in the shadow DOM, you can use slots to pass it in. Please see attached files for reference.

Let me know if this works for you.


Regards,

Sherwin Diesta IMA SDK Team

ref:_00D1U1174p._5004Q2DIto2:ref

[Noa Vitenshtein]

Hi,

Thanks for the detailed example but, this solution is a bit problematic for us.

We are using React so adding web components will require major refactor in our code, and secondly, Slots has very limited browsers support so it will limit our player's browser support.

Is there another solution for React app?

Regards,

Noa Vitenshtein

[IMA SDK]

Hi Noah,

I rechecked the error received in the sample you gave us and it's the same error that the original sample demonstration app created. For now  this error is related to OMID, so if you are not interested in using OMID this should not cause any problems, but as of right now it doesn't look like OMID will function within the shadow dom without the workaround of using slots.

My team is working on a more actionable console output and you may monitor our release notes for an update.

Regards,

 

Aryeh Baker IMA SDK Team

ref:_00D1U1174p._5004Q2DIto2:ref

[Luca]

Hi, 

  I have the same issue with a web component audio player that use Shadow DOM. In January the audio player not had this issue. 

The link is https://www.salute.eu/dossier/noi-e-loro/ and in Dev Console I have 6 Errors like the 6 instances of the player audio.

Thanks, Luca

[IMA SDK]

Hi Luca,

Thank you for reporting this. You can ignore the error as long as you aren't using OMID. We are working on a solution so that only if have an OMID ad you will see a clear, understandable error. You may monitor our our release notes for an update.

[Noa Vitenshtein]

Hi, 

I'm not using an OMID, is there a way that the error will not be shown on the console?

Regards,

Noa

[IMA SDK]

Hi Noa,

My team is looking into not showing an error when not using OMID and you may monitor our release notes for an update.

[Noa Vitenshtein]

Great thanks for all of the help.

Regards, 

Noa

[Noa Vitenshtein]

Hi,

Is there any time frame for this release?

Regards, 

Noa

[IMA SDK]

Hi Noa,

Your request is being seriously considered. Unfortunately, we don't have a timeframe. You may monitor our release notes for an update.