Can we execute a custom script function in Wappler?

Wappler General How To
#1

Here is an example,
I have a form which send data to a server connect api on submit. If it fails to do so due to some unknown error then I am storing the form data in local storage using Wappler functionality. but along with this method I want to register a service worker sync tag. I have written a simple script function in the script tag of main layout and I want to execute that function from Wappler.

How can I fix this issue ? And how can I access IndexedDB in Wappler ?

I am working on background syncing feature of PWA service worker in node js application. If there are other fixes for the above issue It will be very helpful !

<script>
    function syncComment(){
     if ('serviceWorker' in navigator && 'SyncManager' in window) {
        navigator.serviceWorker.ready.then(function(swRegistration) {
        return swRegistration.sync.register('myFirstSync');
      });
     }
    }
  </script>
#2

Are you sure that you want to go into that direction? At the moment, only Chrome and Edge support the SyncManager API

#3

I want to try this personally with wappler, are there any other workarounds ?

Wappler community has PWA installed, and also has indexedDb working in this. I hope this is built with wappler !

#4

Calling a JS function from Wappler is quite easy.
There are two ways:

  1. Use a static event. For eg: on error event, just call the function.
  2. Use flows. In the dynamic event of on error, instead of selecting actions, select flow. There, one of the steps is called run JS. There, just put the function name, without parentheses. And arguments, if any, use the grid just below that input.
1 Like
Need help on Routing: Unable to run script on content page
#5

Wappler community uses Discourse. wappler.io is built with Wappler.

#6

It works, thank you very much.

Any ideas for using IndexedDb ?

#7

Please try to ask different questions in different topics

#8

IMO, this should not be a function, but a straight out script that gets called on page load.

If the file is called app.js and the content is

     if ('serviceWorker' in navigator && 'SyncManager' in window) {
        navigator.serviceWorker.ready.then(function(swRegistration) {
        return swRegistration.sync.register('myFirstSync');
      });
     }

then place a link in the page like

<script src="app.js"></script>

or similar.