Cannot pass other props other than "style" in iframeProps on Typescript embed SDK

@mathio or @picsoung can help you out with this!

Hello @heitor 

in the embed SDK options you can find an option called iframeProps. All props provided here will be added to the iframe. In your case something like this:

1<div data-tf-widget="<id>"      data-tf-iframe-props="data-hj-allow-iframe="></div><script src="//embed.typeform.com/next/embed.js"></script>

Let me know if this works.

Hey @mathio thanks for the reply.

I am using the typescript binding and seems like the only prop accepted is “style” as per the types.

The error on the highlighted line is:

1Type '{ 'data-hj-allow-iframe': string; }' is not assignable to type 'Partial<HTMLIFrameElementWithStyleString>'.  Object literal may only specify known properties, and ''data-hj-allow-iframe'' does not exist in type 'Partial<HTMLIFrameElementWithStyleString>'.ts(2322)

I should somehow be able to skip typescripts’s type validation and go straight to the JS embed SDK, but it doesn’t seem right.

Does that make any sense or am I just missing something? Sorry I am no expert in none of these languages.

Regards,

Heitor

Hi @heitor 

I think the correct usage is to use camelCase instead of kebab-case for the attribute name. In your case it should be named dataHjAllowIframe like this:

1createWidget(environment.typeform, {  // ...  iframeProps: {    dataHjAllowIframe: true  }})

Regarding the typings - try using the latest version of the library, we recently updated the type to allow data attributes. Alternatively, you could just cast it as any it should not affect functionality 😃

Hey @mathio !

I just updated from 2.13.0 to 2.16.0 as it worked perfectly!

Thank you very much!

Glad to hear it, @heitor ! Thanks, @mathio !