Bug: webview tag not properly rendering allowpopups boolean attribute?

[jamesrusso]

React version: v18.2.0

Steps To Reproduce

Setup a <webview> element and add an allowpopups={true} and you would expect this allowpopups element to be added to the rendered element. It is not.

Code:

Rendered Elements from Devtools:

The WebViewHTMLAttributes Interface

Example Repo

https://github.com/halo3consulting/react-webview-allowpopups-attribute-example

git clone https://github.com/halo3consulting/react-webview-allowpopups-attribute-example
cd react-webview-allowpopups-attribute-example
npm install
npm run dev

Expand the dev-tools elements to look at the rendered webview. You can see that the allowpopups element is not there.

The current behavior

The webview element does not render with the allowpopups attribute when the value is true.

The expected behavior

The webview element does render with the allow popups attribute.

[VickySource]

Hi @jamesrusso, thanks for reporting this! 👋 I was able to reproduce the issue with the example repo you shared. The allowpopups boolean attribute on is not being forwarded correctly.

I’d like to take this up and work on a fix. I’ll start by checking how React handles boolean attributes for non-standard elements like .

Will keep you updated with progress.

@VickySource

[jamesrusso]

Thanks @VickySource

While you work on this if there is any workaround you may be aware of I'd really appreciate it so I can try and get my project pushed along.

[jamesrusso]

it's interesting to note and is likely related that eslint is warning that allowpopups is not a react attribute.

When I follow the <webview> element definition I am brought here: (in @types/react/index.d.ts, in the global/JSX/InstrinsicElements interface)

Following the WebViewHTMLAttributes definition I am brought here (in @types/react in the React namespace)

Following the HTMLWebViewElement brings me to this empty interface here:

[VickySource]

Hi @jamesrusso , thanks for digging deeper into this and pointing out the ESLint / TypeScript angle 👏

I’ve started working on the runtime side in React core. Specifically, I added allowpopups to React’s internal attribute mapping so that it gets forwarded correctly to . I’m currently building and testing to confirm the behavior with your example repo.

As you noted, there’s also a separate typing issue: @types/react doesn’t currently define allowpopups in WebViewHTMLAttributes, which is why ESLint complains. That will need a follow-up PR on DefinitelyTyped to extend the type definitions.

I’ll keep you posted once I confirm the runtime fix.

Thanks again for reporting and for the detailed investigation — it really helps speed things up! 🙌

[github-actions[bot]]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!