I’m happy to announce the first frontend App Connect custom component release. This is just a small example that shows how to extend a core App Connect component.
This one extends the core browser component released by Wappler team and adds a reload method based on this feature request.
There is one caveat at the moment. It’s not suitable for those that rely heavily on the UI as there is no UI support for now. You need to use it in code view.
There are two approaches to use this extension.
- You can fully replace Wappler’s browser component with this one and use all the methods via code view
- Or you can use both components and use the UI for Wappler’s browser component and code view just for this custom component.
How to use it?
Download the file from the repository releases, add it to your project folder and call it in your script tag after the core browser js file. This is needed because this custom component just extends functionality.
The defer attribute is mandatory. It won’t work without it.
<script src="/dmxAppConnect/dmxBrowser/dmxBrowser.js" defer=""></script>
<script src="/path/to/jonlBrowserExtended.js" defer=""></script>
Add the component/s to your body depending on what approach you want to take 1) or 2)
<div is="dmx-browser" id="browser"></div> <!-- Optional. Use if using approach 1) -->
<div is="dmx-jonl-browser-extended" id="browserExtended"></div> <!-- Required with 1) and 2) -->
Now you can use browserExtended.reload() method as you would use any other browser method.
<button id="button1" dmx-on:click="browserExtended.reload()">Reload</button>
<button id="button2" dmx-on:click="browserExtended.alert('hello')">Alert</button>
<button id="button3" dmx-on:click="browser.reload()">Reload</button> <!-- Won't work -->
<button id="button4" dmx-on:click="browser.alert('hello')">Alert</button>
F.A.Q.
Will this release change my life?
Nope.
Do I need this release?
Most probably not. At least not version 0.1 which only contains the reload method.
Why did you build it?
Because they told me it couldn’t be done.
Really?
Nope. I just built it as an exercise to learn how to extend App Connect components and because there was a feature request for the browser.reload() method.
Also it’s my cake day so what better day to do something useless for the community?
Will you continue development?
Yes. Once the team adds UI support and if there is a need I will continue development by adding more methods that might be missing from the core component. Also the community is free to improve it as I do accept pull requests in the public repository.
