BREAKING CHANGE: wml attributes are now prefixed with data-

wailsapp · Jan 27, 2025 · b3e81f5 · b3e81f5
1 parent 939e2da
commit b3e81f5
Show file tree

Hide file tree

Showing 32 changed files with 80 additions and 81 deletions.
diff --git a/v3/examples/file-association/frontend/index.html b/v3/examples/file-association/frontend/index.html
@@ -10,10 +10,10 @@
 <body>
 <div class="container">
     <div>
-        <a wml-openURL="https://wails.io">
+        <a data-wml-openURL="https://wails.io">
             <img src="/wails.png" class="logo" alt="Wails logo"/>
         </a>
-        <a wml-openURL="https://developer.mozilla.org/en-US/docs/Web/JavaScript">
+        <a data-wml-openURL="https://developer.mozilla.org/en-US/docs/Web/JavaScript">
             <img src="/javascript.svg" class="logo vanilla" alt="JavaScript logo"/>
         </a>
     </div>

diff --git a/v3/examples/plain/main.go b/v3/examples/plain/main.go
@@ -19,7 +19,7 @@ func main() {
 		Assets: application.AssetOptions{
 			Handler: http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
 				w.WriteHeader(http.StatusOK)
-				w.Write([]byte(`<html><head><title>Plain Bundle</title><script type="module" src="/wails/runtime.js"></script></head><body><div class="main"><h1>Plain Bundle</h1><p>This is a plain bundle. It has no frontend code but this was Served by the AssetServer's Handler.</p><br/><br/><p wml-event="clicked">Clicking this paragraph emits an event...<p></div></body></html>`))
+				w.Write([]byte(`<html><head><title>Plain Bundle</title><script type="module" src="/wails/runtime.js"></script></head><body><div class="main"><h1>Plain Bundle</h1><p>This is a plain bundle. It has no frontend code but this was Served by the AssetServer's Handler.</p><br/><br/><p data-wml-event="clicked">Clicking this paragraph emits an event...<p></div></body></html>`))
 			}),
 		},
 	})

diff --git a/v3/examples/window-api/assets/index.html b/v3/examples/window-api/assets/index.html
diff --git a/v3/examples/wml/README.md b/v3/examples/wml/README.md
@@ -1,6 +1,6 @@
 # WML Example
 
-This is an example of how to use the experimental WML, which provides HTMX style calling of the runtime API.
+This is an example of how to use the experimental WML, which provides HTMX style calling of the Wails JS API.
 
 ## Running the example
 

diff --git a/v3/examples/wml/assets/index.html b/v3/examples/wml/assets/index.html
diff --git a/v3/internal/assetserver/bundledassets/runtime.debug.js b/v3/internal/assetserver/bundledassets/runtime.debug.js
diff --git a/v3/internal/assetserver/bundledassets/runtime.js b/v3/internal/assetserver/bundledassets/runtime.js
diff --git a/v3/internal/runtime/desktop/@wailsio/runtime/package.json b/v3/internal/runtime/desktop/@wailsio/runtime/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@wailsio/runtime",
   "type": "module",
-  "version": "3.0.0-alpha.39",
+  "version": "3.0.0-alpha.40",
   "description": "Wails Runtime",
   "types": "types/index.d.ts",
   "exports": {

diff --git a/v3/internal/runtime/desktop/@wailsio/runtime/src/wml.js b/v3/internal/runtime/desktop/@wailsio/runtime/src/wml.js
@@ -60,10 +60,10 @@ function onWMLTriggered(ev) {
         if (choice !== "Yes")
             return;
 
-        const eventType = element.getAttribute('wml-event');
-        const targetWindow = element.getAttribute('wml-target-window') || "";
-        const windowMethod = element.getAttribute('wml-window');
-        const url = element.getAttribute('wml-openurl');
+        const eventType = element.getAttribute('data-wml-event');
+        const targetWindow = element.getAttribute('data-wml-target-window') || "";
+        const windowMethod = element.getAttribute('data-wml-window');
+        const url = element.getAttribute('data-wml-openURL');
 
         if (eventType !== null)
             sendEvent(eventType);
@@ -73,7 +73,7 @@ function onWMLTriggered(ev) {
             void OpenURL(url);
     }
 
-    const confirm = element.getAttribute('wml-confirm');
+    const confirm = element.getAttribute('data-wml-confirm');
 
     if (confirm) {
         Question({
@@ -218,7 +218,7 @@ const triggerRegistry = canAbortListeners() ? new AbortControllerRegistry() : ne
  */
 function addWMLListeners(element) {
     const triggerRegExp = /\S+/g;
-    const triggerAttr = (element.getAttribute('wml-trigger') || "click");
+    const triggerAttr = (element.getAttribute('data-wml-trigger') || "click");
     const triggers = [];
 
     let match;
@@ -246,5 +246,5 @@ export function Enable() {
  */
 export function Reload() {
     triggerRegistry.reset();
-    document.body.querySelectorAll('[wml-event], [wml-window], [wml-openurl]').forEach(addWMLListeners);
+    document.body.querySelectorAll('[data-wml-event], [data-wml-window], [data-wml-openURL]').forEach(addWMLListeners);
 }
diff --git a/v3/internal/templates/base/frontend/index.html b/v3/internal/templates/base/frontend/index.html
@@ -10,10 +10,10 @@
 <body>
 <div class="container">
     <div>
-        <a wml-openURL="https://wails.io">
+        <a data-wml-openURL="https://wails.io">
             <img src="/wails.png" class="logo" alt="Wails logo"/>
         </a>
-        <a wml-openURL="https://developer.mozilla.org/en-US/docs/Web/JavaScript">
+        <a data-wml-openURL="https://developer.mozilla.org/en-US/docs/Web/JavaScript">
             <img src="/javascript.svg" class="logo vanilla" alt="JavaScript logo"/>
         </a>
     </div>

diff --git a/v3/internal/templates/lit-ts/frontend/src/my-element.ts b/v3/internal/templates/lit-ts/frontend/src/my-element.ts
@@ -45,10 +45,10 @@ export class MyElement extends LitElement {
         return html`
             <div class="container">
                 <div>
-                    <a wml-openURL="https://wails.io">
+                    <a data-wml-openURL="https://wails.io">
                         <img src="/wails.png" class="logo" alt="Wails logo"/>
                     </a>
-                    <a wml-openURL="https://lit.dev">
+                    <a data-wml-openURL="https://lit.dev">
                         <img src="/lit.svg" class="logo lit" alt="Lit logo"/>
                     </a>
                 </div>

diff --git a/v3/internal/templates/lit/frontend/src/my-element.js b/v3/internal/templates/lit/frontend/src/my-element.js
@@ -35,10 +35,10 @@ export class MyElement extends LitElement {
         return html`
             <div class="container">
                 <div>
-                    <a wml-openURL="https://wails.io">
+                    <a data-wml-openURL="https://wails.io">
                         <img src="/wails.png" class="logo" alt="Wails logo"/>
                     </a>
-                    <a wml-openURL="https://lit.dev">
+                    <a data-wml-openURL="https://lit.dev">
                         <img src="/lit.svg" class="logo lit" alt="Lit logo"/>
                     </a>
                 </div>

diff --git a/v3/internal/templates/preact-ts/frontend/src/app.tsx b/v3/internal/templates/preact-ts/frontend/src/app.tsx
@@ -29,10 +29,10 @@ export function App() {
         <>
             <div className="container">
                 <div>
-                    <a wml-openURL="https://wails.io">
+                    <a data-wml-openURL="https://wails.io">
                         <img src="/wails.png" className="logo" alt="Wails logo"/>
                     </a>
-                    <a wml-openURL="https://preactjs.com">
+                    <a data-wml-openURL="https://preactjs.com">
                         <img src="/preact.svg" className="logo preact" alt="Preact logo"/>
                     </a>
                 </div>

diff --git a/v3/internal/templates/preact/frontend/src/app.jsx b/v3/internal/templates/preact/frontend/src/app.jsx
@@ -28,10 +28,10 @@ export function App() {
   return (
     <div className="container">
       <div>
-        <a wml-openURL="https://wails.io">
+        <a data-wml-openURL="https://wails.io">
           <img src="/wails.png" className="logo" alt="Wails logo"/>
         </a>
-        <a wml-openURL="https://preactjs.com">
+        <a data-wml-openURL="https://preactjs.com">
           <img src="/preact.svg" className="logo preact" alt="Preact logo"/>
         </a>
       </div>

diff --git a/v3/internal/templates/qwik-ts/frontend/src/app.tsx b/v3/internal/templates/qwik-ts/frontend/src/app.tsx
@@ -30,10 +30,10 @@ export const App = component$(() => {
   return (
     <div class="container">
       <div>
-        <a wml-openURL="https://wails.io">
+        <a data-wml-openURL="https://wails.io">
           <img src="/wails.png" class="logo" alt="Wails logo"/>
         </a>
-        <a wml-openURL="https://qwik.builder.io">
+        <a data-wml-openURL="https://qwik.builder.io">
           <img src="/qwik.svg" class="logo qwik" alt="Qwik logo"/>
         </a>
       </div>

diff --git a/v3/internal/templates/qwik/frontend/src/app.jsx b/v3/internal/templates/qwik/frontend/src/app.jsx
@@ -30,10 +30,10 @@ export const App = component$(() => {
   return (
     <div class="container">
       <div>
-        <a wml-openURL="https://wails.io">
+        <a data-wml-openURL="https://wails.io">
           <img src="/wails.png" class="logo" alt="Wails logo"/>
         </a>
-        <a wml-openURL="https://qwik.builder.io">
+        <a data-wml-openURL="https://qwik.builder.io">
           <img src="/qwik.svg" class="logo qwik" alt="Qwik logo"/>
         </a>
       </div>

diff --git a/v3/internal/templates/react-swc-ts/frontend/src/App.tsx b/v3/internal/templates/react-swc-ts/frontend/src/App.tsx
@@ -30,10 +30,10 @@ function App() {
   return (
       <div className="container">
         <div>
-          <a wml-openURL="https://wails.io">
+          <a data-wml-openURL="https://wails.io">
             <img src="/wails.png" className="logo" alt="Wails logo"/>
           </a>
-          <a wml-openURL="https://reactjs.org">
+          <a data-wml-openURL="https://reactjs.org">
             <img src="/react.svg" className="logo react" alt="React logo"/>
           </a>
         </div>

diff --git a/v3/internal/templates/react-swc/frontend/src/App.jsx b/v3/internal/templates/react-swc/frontend/src/App.jsx
@@ -30,10 +30,10 @@ function App() {
   return (
     <div className="container">
       <div>
-        <a wml-openURL="https://wails.io">
+        <a data-wml-openURL="https://wails.io">
           <img src="/wails.png" className="logo" alt="Wails logo"/>
         </a>
-        <a wml-openURL="https://reactjs.org">
+        <a data-wml-openURL="https://reactjs.org">
           <img src='/react.svg' className="logo react" alt="React logo"/>
         </a>
       </div>

diff --git a/v3/internal/templates/react-ts/frontend/src/App.tsx b/v3/internal/templates/react-ts/frontend/src/App.tsx
@@ -30,10 +30,10 @@ function App() {
   return (
     <div className="container">
       <div>
-        <a wml-openURL="https://wails.io">
+        <a data-wml-openURL="https://wails.io">
           <img src="/wails.png" className="logo" alt="Wails logo"/>
         </a>
-        <a wml-openURL="https://reactjs.org">
+        <a data-wml-openURL="https://reactjs.org">
           <img src="/react.svg" className="logo react" alt="React logo"/>
         </a>
       </div>

diff --git a/v3/internal/templates/react/frontend/src/App.jsx b/v3/internal/templates/react/frontend/src/App.jsx
@@ -30,10 +30,10 @@ function App() {
   return (
     <div className="container">
       <div>
-        <a wml-openURL="https://wails.io">
+        <a data-wml-openURL="https://wails.io">
           <img src="/wails.png" className="logo" alt="Wails logo"/>
         </a>
-        <a wml-openURL="https://reactjs.org">
+        <a data-wml-openURL="https://reactjs.org">
           <img src='/react.svg' className="logo react" alt="React logo"/>
         </a>
       </div>

diff --git a/v3/internal/templates/solid-ts/frontend/src/App.tsx b/v3/internal/templates/solid-ts/frontend/src/App.tsx
@@ -28,10 +28,10 @@ function App() {
   return (
     <div class="container">
       <div>
-        <a wml-openURL="https://wails.io">
+        <a data-wml-openURL="https://wails.io">
           <img src="/wails.png" class="logo" alt="Wails logo"/>
         </a>
-        <a wml-openURL="https://solidjs.com">
+        <a data-wml-openURL="https://solidjs.com">
           <img src="/solid.svg" class="logo solid" alt="Solid logo"/>
         </a>
       </div>

diff --git a/v3/internal/templates/solid/frontend/src/App.jsx b/v3/internal/templates/solid/frontend/src/App.jsx
@@ -28,10 +28,10 @@ function App() {
   return (
     <div className="container">
       <div>
-        <a wml-openURL="https://wails.io">
+        <a data-wml-openURL="https://wails.io">
           <img src="/wails.png" className="logo" alt="Wails logo"/>
         </a>
-        <a wml-openURL="https://solidjs.com">
+        <a data-wml-openURL="https://solidjs.com">
           <img src="/solid.svg" className="logo solid" alt="Solid logo"/>
         </a>
       </div>

diff --git a/v3/internal/templates/svelte-ts/frontend/src/App.svelte b/v3/internal/templates/svelte-ts/frontend/src/App.svelte
@@ -25,10 +25,10 @@
 
 <div class="container">
   <div>
-    <span wml-openURL="https://wails.io">
+    <span data-wml-openURL="https://wails.io">
       <img src="/wails.png" class="logo" alt="Wails logo"/>
     </span>
-    <span wml-openURL="https://svelte.dev">
+    <span data-wml-openURL="https://svelte.dev">
       <img src="/svelte.svg" class="logo svelte" alt="Svelte logo"/>
     </span>
   </div>

diff --git a/v3/internal/templates/svelte/frontend/src/App.svelte b/v3/internal/templates/svelte/frontend/src/App.svelte
@@ -25,10 +25,10 @@ Events.On('time', (timeValue) => {
 
 <div class="container">
   <div>
-    <span wml-openURL="https://wails.io">
+    <span data-wml-openURL="https://wails.io">
       <img src="/wails.png" class="logo" alt="Wails logo"/>
     </span>
-    <span wml-openURL="https://svelte.dev">
+    <span data-wml-openURL="https://svelte.dev">
       <img src="/svelte.svg" class="logo svelte" alt="Svelte logo"/>
     </span>
   </div>

diff --git a/v3/internal/templates/sveltekit-ts/frontend/src/routes/+page.svelte b/v3/internal/templates/sveltekit-ts/frontend/src/routes/+page.svelte
@@ -25,10 +25,10 @@ Events.On('time', (timeValue) => {
 
 <div class="container">
   <div>
-    <span wml-openURL="https://wails.io">
+    <span data-wml-openURL="https://wails.io">
       <img src="/wails.png" class="logo" alt="Wails logo"/>
     </span>
-    <span wml-openURL="https://svelte.dev">
+    <span data-wml-openURL="https://svelte.dev">
       <img src="/svelte.svg" class="logo svelte" alt="Svelte logo"/>
     </span>
   </div>

diff --git a/v3/internal/templates/sveltekit/frontend/src/routes/+page.svelte b/v3/internal/templates/sveltekit/frontend/src/routes/+page.svelte
@@ -25,10 +25,10 @@ Events.On('time', (timeValue) => {
 
 <div class="container">
   <div>
-    <span wml-openURL="https://wails.io">
+    <span data-wml-openURL="https://wails.io">
       <img src="/wails.png" class="logo" alt="Wails logo"/>
     </span>
-    <span wml-openURL="https://svelte.dev">
+    <span data-wml-openURL="https://svelte.dev">
       <img src="/svelte.svg" class="logo svelte" alt="Svelte logo"/>
     </span>
   </div>

diff --git a/v3/internal/templates/vanilla-ts/frontend/index.html b/v3/internal/templates/vanilla-ts/frontend/index.html
@@ -10,10 +10,10 @@
 <body>
 <div class="container">
     <div>
-        <a wml-openURL="https://wails.io">
+        <a data-wml-openURL="https://wails.io">
             <img src="/wails.png" class="logo" alt="Wails logo"/>
         </a>
-        <a wml-openURL="https://www.typescriptlang.org/">
+        <a data-wml-openURL="https://www.typescriptlang.org/">
             <img src="/typescript.svg" class="logo vanilla" alt="Typescript logo"/>
         </a>
     </div>

diff --git a/v3/internal/templates/vanilla/frontend/index.html b/v3/internal/templates/vanilla/frontend/index.html
@@ -10,10 +10,10 @@
 <body>
 <div class="container">
     <div>
-        <a wml-openURL="https://wails.io">
+        <a data-wml-openURL="https://wails.io">
             <img src="/wails.png" class="logo" alt="Wails logo"/>
         </a>
-        <a wml-openURL="https://developer.mozilla.org/en-US/docs/Web/JavaScript">
+        <a data-wml-openURL="https://developer.mozilla.org/en-US/docs/Web/JavaScript">
             <img src="/javascript.svg" class="logo vanilla" alt="JavaScript logo"/>
         </a>
     </div>

diff --git a/v3/internal/templates/vue-ts/frontend/src/App.vue b/v3/internal/templates/vue-ts/frontend/src/App.vue
@@ -5,10 +5,10 @@ import HelloWorld from './components/HelloWorld.vue'
 <template>
   <div class="container">
     <div>
-      <a wml-openURL="https://wails.io">
+      <a data-wml-openURL="https://wails.io">
         <img src="/wails.png" class="logo" alt="Wails logo"/>
       </a>
-      <a wml-openURL="https://vuejs.org/">
+      <a data-wml-openURL="https://vuejs.org/">
         <img src="/vue.svg" class="logo vue" alt="Vue logo"/>
       </a>
     </div>

diff --git a/v3/internal/templates/vue/frontend/src/App.vue b/v3/internal/templates/vue/frontend/src/App.vue
@@ -5,10 +5,10 @@ import HelloWorld from './components/HelloWorld.vue'
 <template>
 <div class="container">
   <div>
-    <a wml-openURL="https://wails.io">
+    <a data-wml-openURL="https://wails.io">
       <img src="/wails.png" class="logo" alt="Wails logo"/>
     </a>
-    <a wml-openURL="https://vuejs.org/">
+    <a data-wml-openURL="https://vuejs.org/">
       <img src="/vue.svg" class="logo vue" alt="Vue logo"/>
     </a>
   </div>

diff --git a/v3/pkg/application/assets/alpha/index.html b/v3/pkg/application/assets/alpha/index.html
diff --git a/v3/pkg/application/webview_window_windows.go b/v3/pkg/application/webview_window_windows.go
@@ -1197,7 +1197,6 @@ func (w *windowsWebviewWindow) WndProc(msg uint32, wparam, lparam uintptr) uintp
 	case w32.WM_SYSKEYUP:
 		w.parent.emit(events.Windows.WindowKeyUp)
 	case w32.WM_KEYDOWN:
-		globalApplication.info("w32.WM_KEYDOWN: %v", uint(wparam))
 		w.parent.emit(events.Windows.WindowKeyDown)
 		w.processKeyBinding(uint(wparam))
 	case w32.WM_KEYUP: