Builder.registerComponent "SecurityError: The operation is insecure." on Firefox

Technical Questions CMS
,
1

Hello,

We are trying to integrate Builder.io in an existing application and we are having an issue with Builder.RegisterComponent.

We registered a component that has click events. When the user click on the component action button, they are supposed to be redirected to a new page.

This work as expected in Google Chrome but Firefox (89) gives us a DomException: “this operation is insecure”.

We tried to find out what could cause the issue but haven’t had luck so far.

We tried to replicate the issue locally but then the issue doesn’t happen.

Step to reproduce:

Create a component that pushes to the history object, then register it using Builder.registerComponent:

import {withRouter} from "react-router"
import {Builder} from "@builder.io/react"

function MyLink({ history }) {
const handleClick = () => history.push("/page")

return <button onClick={handleClick}>nav</button>
}

const Link = withRouter(MyLink);

Builder.RegisterComponent(Link, {name: "link"});

Then inside Builder.io, use this component in one page or section, publish the change and try clicking on the button.

More Information:

The application is served by an express server, we already allowed *.builder.io in the CSP headers.

The issue only happens in Firefox (tested with 89) so far. On linux and Windows.

The only error we manage to retrieve is : **Error: SecurityError: The operation is insecure.
**

Thank you if you can help with this issue.

2

@Armand we followed those steps on our side and were not able to reproduce. Any additional details of your setup would help us investigate!

3

Hello Kara,

My apologies, it took me a while to fix this issue but then I forgot to update this post :frowning:

The issue was that my website was behind htpasswd basic authentication. The main link I had for testing was https://user:pass@mywebsite.com. Which I didn’t notice at first and it was displayed as https://mywebsite.com in the browser URL. This caused the security exception.

When testing on other browsers, I did type the url https://mywebsite.com by hand, without the user:pass, thus not getting the error.

Edit: the solution was to remove the user:pass@ from the URL and then I’m able to click on links without having security exceptions.

Thank you for your help and sorry for the late reply.

1 Like