Startsida Utforska Hjälp
Registrera dig Logga in
oleg
/
alpine
spegling av https://github.com/alpinejs/alpine.git
1
0
Fork 0
Filer Ärenden 0 Wiki
Bläddra i källkod

wip

Caleb Porzio 5 år sedan
förälder
f537f27153
incheckning
d2f5d66c91
5 ändrade filer med 50 tillägg och 1 borttagningar
Unifierad Vy Visa Diff Statistik
  1. 1 1
      dist/mix-manifest.json
  2. 3 0
      dist/project-x.js
  3. 7 0
      index.html
  4. 3 0
      src/component.js
  5. 36 0
      test/on.spec.js

+ 1 - 1
dist/mix-manifest.json
Visa fil 

@@ -1,4 +1,4 @@
 
 {
 
 {
 
-    "/project-x.js": "/project-x.js?id=b1f0f893df2af0b6f35c",
 
+    "/project-x.js": "/project-x.js?id=933cb9113a8cbed1ce12",
 
     "/project-x.min.js": "/project-x.min.js?id=594fb2ceb5a9311a8dfb"
 
     "/project-x.min.js": "/project-x.min.js?id=594fb2ceb5a9311a8dfb"
 
 }
 
 }

+ 3 - 0
dist/project-x.js
Visa fil 

@@ -1050,6 +1050,9 @@ function () {
 
         });
 
         });
 
       } else {
 
       } else {
 
         el.addEventListener(event, function (e) {
 
         el.addEventListener(event, function (e) {
 
+          if (modifiers.includes('prevent')) e.preventDefault();
 
+          if (modifiers.includes('stop')) e.stopPropagation();
 
+
 
           _this2.runListenerHandler(expression, e);
 
           _this2.runListenerHandler(expression, e);
 
         });
 
         });
 
       }
 
       }

+ 7 - 0
index.html
Visa fil 

@@ -10,6 +10,13 @@
 
     <body>
 
     <body>
 
         <a href="/link-target">turbo-page</a>
 
         <a href="/link-target">turbo-page</a>
 
 
 
+        <div x-data="{ foo: 'bar' }">
 
+            <div x-on:click="foo = 'baz'">
 
+                <button x-on:click.stop></button>
 
+            </div>
 
+
 
+            <span x-text="foo"></span>
 
+        </div>
 
 
 
         <div x-data="{ foo: 'bar' }">
 
         <div x-data="{ foo: 'bar' }">
 
             <input x-model="foo"></input>
 
             <input x-model="foo"></input>

+ 3 - 0
src/component.js
Visa fil 

@@ -136,6 +136,9 @@ export default class Component {
 
             })
 
             })
 
         } else {
 
         } else {
 
             el.addEventListener(event, e => {
 
             el.addEventListener(event, e => {
 
+                if (modifiers.includes('prevent')) e.preventDefault()
 
+                if (modifiers.includes('stop')) e.stopPropagation()
 
+
 
                 this.runListenerHandler(expression, e)
 
                 this.runListenerHandler(expression, e)
 
             })
 
             })
 
         }
 
         }

+ 36 - 0
test/on.spec.js
Visa fil 

@@ -54,6 +54,42 @@ test('data modified in event listener doesnt update uneffected attribute binding
 
     })
 
     })
 
 })
 
 })
 
 
 
+test('.stop modifier', async () => {
 
+    document.body.innerHTML = `
 
+        <div x-data="{ foo: 'bar' }">
 
+            <button x-on:click="foo = 'baz'">
 
+                <span></span>
 
+            </button>
 
+        </div>
 
+    `
 
+
 
+    projectX.start()
 
+
 
+    expect(document.querySelector('div').__x.data.foo).toEqual('bar')
 
+
 
+    document.querySelector('span').click()
 
+
 
+    await wait(() => {
 
+        expect(document.querySelector('div').__x.data.foo).toEqual('baz')
 
+    })
 
+})
 
+
 
+test('.prevent modifier', async () => {
 
+    document.body.innerHTML = `
 
+        <div x-data="{}">
 
+            <input type="checkbox" x-on:click.prevent>
 
+        </div>
 
+    `
 
+
 
+    projectX.start()
 
+
 
+    expect(document.querySelector('input').checked).toEqual(false)
 
+
 
+    document.querySelector('input').click()
 
+
 
+    expect(document.querySelector('input').checked).toEqual(false)
 
+})
 
+
 
 test('click away', async () => {
 
 test('click away', async () => {
 
     document.body.innerHTML = `
 
     document.body.innerHTML = `
 
         <style>.hidden { display: none; }</style>
 
         <style>.hidden { display: none; }</style>