Guide 99 – Create a PHPRunner Plugin from a Web Components

As I mentioned in the previous article, I created a View and Edit plugin from an Awesome Web Components , specifically the "Switch".

Here's a brief summary of what we've seen so far:

• What is a Web Component and how does it compare to jQuery plugins (which are the basis of PHPRunner plugins)?
• How to create Web Components with Svelte 5 and use them in PHPRunner .
• How to use third-party Web Components, such as those from Awesome .

And with this article, I complete the cycle, because what remains are concrete examples or applications of what we have learned.

Aim

Creating a PHPRunner plugin (View and Edit) from a third-party Web Components (Awesome).

DEMO: https://fhumanes.com/wc_test2/

To perform integration tests, carry out CRUD operations, both full page and INLINE.

Technical Solution

To use Awesome Web Components, the manufacturer indicates that in web mode you should use these links:

< link rel= "stylesheet" href= "https://ka-f.webawesome.com/webawesome@3.7.0/styles/webawesome.css" / >

< script type= "module" src= "https://ka-f.webawesome.com/webawesome@3.7.0/webawesome.loader.js" >< /script >

I haven't been able to integrate the loading of these files into the plugins, so they have to be defined in the header of every page.

If you're interested in this article, continue reading it at this link.