html5 - draggable="true" isn't working inside Chrome Packaged App's <webview> -


tl;dr element draggable when viewed in chrome isn't draggable when viewed in chrome packaged app's <webview>, why?


edit:

tested on chrome 29.0.1521.3 dev, still no luck when inside packaged app, chrome works fine.


experimenting chrome packaged apps, wanted test capability of webview... apparently, pages loaded within webview should behave if being viewed chrome (apart few features being disabled).

i made app consisted solely of page single <webview>. inner page shows <ol> 3 <li> elements. each <li> has draggable="true" attribute, no matter try, elements not react @ drag.

i know chrome packaged apps have many css declarations avoid user selecting text, etc. there in there stop things being dragged?

manifest.json

{   "manifest_version": 2,   "name": "webview test",   "minimum_chrome_version": "24.0.1307.0",   "version": "1.0",   "icons": {     "16": "icon_16.png",     "128": "icon_128.png"   },   "app": {     "background": {       "scripts": ["main.js"]     }   },   "permissions": [     "webview"   ] } 

main.js

chrome.app.runtime.onlaunched.addlistener(function() {   runapp(); });  chrome.app.runtime.onrestarted.addlistener(function() {   runapp(); });  function runapp() {     chrome.app.window.create('test.html', {         "minwidth": 500,         "minheight": 700,         "frame": "none",         "resizable": false,     }); } 

test.html

<!doctype html> <webview src="http://localhost/webviewpage.html" style="width:100%;height:100%"></webview> 

webviewpage.html

<ol>     <li draggable="true">one</li>     <li draggable="true">two</li>     <li draggable="true">three</li> </ol>  <script> // returns "true": console.log('draggable' in document.createelement('li')); </script> 

the above lis should @ least when user drags them, don't react @ all.

i see mean, sample works me in

mozilla/5.0 (windows nt 5.1) applewebkit/537.36 (khtml, gecko) chrome/29.0.1512.0 safari/537.36 

but not in

mozilla/5.0 (windows nt 5.1) applewebkit/537.31 (khtml, gecko) chrome/26.0.1410.64 safari/537.3 

so, short answer drag broken in stable chrome, drop works, on windows xp @ least.

<html><head><meta http-equiv="content-type" content="text/html; charset=us-ascii">   <script type="text/javascript">window.onload = function() {   document.queryselector('h1#drop').addeventlistener('drop', function(event) {     console.log(event.type + " received by");     console.dir(event.srcelement);     if (event.datatransfer.types && event.datatransfer.types.length) {       console.log("event.datatransfer.getdata(event.datatransfer.types[0]) = " + event.datatransfer.getdata(event.datatransfer.types[0]));     } else {       console.log('try "select all" before dragging...');     }   }, false);   document.queryselector('h1#drop').addeventlistener('dragover', function(event) {     event.preventdefault();     console.count(event.type + " received " + event.srcelement.id);   }, false); } </script> </head><body>   <h1 id="drag" draggable="true">headline draggable</h1> <h1 id="drop" dropzone="copy">headline dropzone</h1> </body></html> 

Comments

Popular posts from this blog

SPSS keyboard combination alters encoding -

Add new record to the table by click on the button in Microsoft Access -

javascript - jQuery .height() return 0 when visible but non-0 when hidden -