I have an issue with using custom JS. I am not sure how to debug this further. I am using JS snippet in HTML embed to integrate Hyvor Talk (Introduction). The custom code has a few variables to log in the users via SSO (Introduction to Single Sign-On).
If I use the code below, I get an error which basically means that the sso object (as shown below) I need to pass is invalid.
But if I copy paste the evaluated function as is, the code works.
Anyone with knowledge of JS can help me what changes between the two scenarios that one works and other does not.
is it because hyvor talk basically embeds an iframe and weweb is not able to access the object or the other way round. That hyvor is not able to access the variables since it is an iframe embedded on a page?
I think injecting a script in an html object with dynamic values will not behave as you imagine.
You can try using a javascript action in a workflow (after fetching the sso data) using the guide in the “vanilla JS” section of the docs you linked.
Probably the best way to integrate this service is to create a custom component that uses their official vue plugin.
I was looking through other threads, it appears it is feasible. Almost similar to what I am trying to do, please see here. I am referencing the thread here Trigger a workflow via JavaScript:
As you can see @caffeinatedwes was able to embed ‘paperform’ using variables inserted in HTML embed. Direct link to the code displayed in the post.
Using the same principle @aurelie seem to imply that such functionality (i.e. variables in embedded HTML) can be achieved using workflows.
It does appear there is a way to embed HTML with dynamic variables. But there is not clear explanation anywhere.
@aurelie or @weweb-team just a small suggestion. A tutorial regarding embedding custom code in HTML embeds might be very useful for your users not as adept in Vuejs as @dorilama
But it is confusing that certain variables embedded within HTML element works just fine as compared to others. Probably there is something related to how components are mounted within vue. But being a no-code tool, a small tutorial on HTML embeds might go long ways. Just my 2 cents.
If it works, then, I can quickly validate the feature. Then next step is to make it secure. Right now it’s more like a go / nogo situation. The feature is important and being a small startup, I want to get something out to validate.
Again, the behaviour of the html element is different from what you expect.
You are trying to set global variables with dynamic values from weweb and loading a script that requires those variables. There are many things that can go wrong here, also because you need to fetch the dynamic values.
A more manageable approach would be to follow the “vanilla javascript” guide of the documentation you linked and execute the code with javascript actions in a workflow.
Still, I think both these methods are going to get you more trouble than using the vue librari of this service.
@dorilama regardless of vanila JS or some weird hybrid I am running. I still need to pass dynamic variables. The vanilla JS still needs to fetch values for those variables.
Without passing the variables, I can get it work. Static JS script works. But the real question is if i need to pass variables, how can I do it?
In the editor of the javascript action you have access to the weweb variables.
Using a workflow you are in charge of the timing of the actions needed (eg. fetch sso data, set global variables, load and initialise the library).
This will make easier for you to understand what’s happening.
