Develop Reference

Aw, snap error in chrome while insert value into web sql using executeSql

I am creating a sqlite editor for android application, it is execute correctly still yesterday and finally just I tried to backup the chrome websql db so just copy the files from the following path "C:\Users\merbin.SERVER\AppData\Local\Google\Chrome\User Data\Profile 1\databases" and "C:\Users\merbin.SERVER\AppData\Local\Google\Chrome\User Data\System Profile\databases". Today I got the Aw, snap error on chrome, I debug the error and found, the error occur when I trying to create a table or inserting data into the database. But select query is execute perfectly. Some code examples are
query="insert into tbl(Type) values('Test')";
insert_query(query,insert_success,insert_fail);
function insert_query(query,succ_fun,fail_fun)
{
db.transaction(function(tx,result)
{
tx.executeSql(query, [],
function(tx,result)
{
eval(succ_fun)(result)
});
},eval(fail_fun));
}
function insert_success(result)
{
debugger;
$("#ex_area").empty();
$("#ex_area").append(result.rowsAffected+" Row(s) Affected.<br> Last Inserted ID is "+result.insertId);
alert("Insert Success");
return false;
}
function insert_fail(result)
{
debugger;
$("#ex_area").empty();
$("#ex_area").append("<span class='error'>"+result.message+"<br> Code : "+result.code+"</span>");
}
After that "eval(succ_fun)(result)" line I getting the Aw, snap error. screenshot is shown below.
image 1 Error on the Next Line Execution Screenshot
image 2 From previous line I am getting this error
Note : I think after update the chrome I have this problem.

I have solve this problem running the code through localserver. First the chrome allow to access the websql without using any server, but recent update chrome has change that rule. So must need any local server like xampp,wamp,IIS or etc...

by running the code through localserver: your JavaScript hosted through local server or the database or both

Create a new Google Chrome shortcut on your desktop.
Right click it, then click properties.
Add -allow-file-access-from-files to the end of the Target.
The end of the target should look like this:
\chrome.exe" -allow-file-access-from-files
Go into Task Manager.
Click Details.
End every single chrome.exe which is running.
Open up Google Chrome using the new shortcut you created.
Open up your website which uses WebSQL.
This worked for me.
Warning:
-allow-file-access-from-files lets Google Chrome have access to all of the files on your computer. ONLY, ONLY use this shortcut for developing. Do not browser the web, especially to untrusted websites, while you have this feature activated.
To deactivate it:
Go into task manager and end all chrome.exe's then open up chrome with a normal shortcut.

Facebook app browser debugging [duplicate]

I'm developing website with a lot of HTML5 and CSS3 features. I'm also using iframe to embed several content on my website. It works fine if I open it using Chrome/Firefox/Safari mobile browser. However, if I share on facebook (post/page) and I opened it up with Facebook application with Facebook Internal Browser, my website is messed up.
Is there any tools or way to debug on Facebook Browser? Thanks.

This is how you can do the debugging yourself. It's painful, but the only way I've come across so far.
tl;dr Get the Facebook App loading a page on your local server so you can iterate quickly. Then print debug statements directly to the page until you figure out what is going on.
Get a link to a page on your local server that you can access on your mobile device (test in mobile safari that it works). See this to find out your local IP address How do you access a website running on localhost from iPhone browser. It will look something like this
http://192.xxx.1.127:3000/facebook-test
Post that link on your Facebook page (you can make it private so your friends aren't all like WTF?)
Click the posted link in the Facebook mobile App and it will open up in Facebook's mobile browser
Since you don't have a console, you basically need to print debug statements directly to the page so it is visible. Put debug statements all over your code. If your problems are primarily related to CSS, then you can iteratively comment out stuff until you've found the issue(s) or print the relevant CSS attributes using JavaScript. Eg something like (using JQuery)
function debug(str){$('body').append("<br>"+str);}
Quite possibly the most painful part. The Facebook browser caches very aggressively. If you are making changes and nothing has happened, it's because the content is cached. You can sometimes resolve this by updating the URLs, eg /facebook-test-1, /facebook-test-2, or adding dummy parameters eg /facebook-test?dummy=1. But if the changes are in external css or js sheets it sometimes will still cache. To 100% clear the cache, delete the Facebook App from your mobile device and reinstall.

The internal browser the Facebook app uses is essentially a uiWebView. Paul Irish has made a simple iOS app that lets you load any URL into a uiWebView which you then can debug using Safari's Developer Tools.
https://github.com/paulirish/iOS-WebView-App

I found a way how to debug it easier. You will need to install the Ghostlab app (You have a 7-day free trial there, however it's totally worth paying for).
In Ghostlab, add the website address (or a localhost address) you want to debug and start the session.
Ghostlab will generate a link for access.
Copy that link and post it on Facebook (as a private post)
Open the link on mobile and that's it! Ghostlab will identify you once you open that link, and will allow you to debug the page.
For debugging, you will have all the same tools as in the Chrome devtools (how cool is that!). For example, you can tweak CSS and see the changes applied live.

If you want to debug a possible error, you can try to catch it and display it.
Put this at the very top of your code:
window.onerror = function (msg, url, lineNo, columnNo, error) {
var string = msg.toLowerCase();
var substring = "script error";
if (string.indexOf(substring) > -1){
alert('Script Error: See Browser Console for Detail');
} else {
var message = [
'Message: ' + msg,
'URL: ' + url,
'Line: ' + lineNo,
'Column: ' + columnNo,
'Error object: ' + JSON.stringify(error)
].join(' - ');
alert(message);
}
}
(Source: MDN)
This will catch and alert your errors.
Share a link on Facebook (privately), or send yourself a message on Facebook Messenger (easier). To break the cache, create a new URL every time, e.g. by appending a random string to the URL.
Follow the link and see if you can find any errors.

With help of ngrok create temporary http & https adress instead of your ordinary localhost:3000(or other port) and you could run your app on any devices. It is super easy to use.
and as it was written above all other useful information you should write somewhere inside div element (in case of React I recommend to put onClick on that div with force update or other function for getting info, sometimes it helps because JS in FB could be executed erlier than your information appears). Keep in mind that alerts are not reliable, sometimes they are blocked
bonus from ngrok that in console you will see which files was
requested and response code (it will replace lack of network tab)
and about iFrame.If you use it on other domain and you rely on cookies - you should know that facebook in-app browser blocks 3rd party cookies
test on Android and iOS separately because technicaly they use different browsers

MS Excel and Power Point cannot properly open local hosted file through WebDAV

I am currently making a project with WebDAV to make some kind of Document Management System. It is an ASP .NET Web Application, hosted in IIS. (Although it's not using IIS WebDAV, but a modification of this project:
http://mvc4webdav.codeplex.com/
For the last few months, it was working properly, but a few days ago, Excel and PowerPoint behave wrongly.
I was using the FFWinplugin or the Sharepoint ActiveXObject (the OpenDocument Control) depending on the browser.
When the user clicks on the document link, it will trigger this function:
function editDocument(event, path) {
event.preventDefault();
if (fNewDoc) {
if (!EditDocumentButton.EditDocument(path)) {
alert(L_EditDocumentRuntimeError_Text);
}
} else {
try {
//************************ This part works for word but not excel or power point
//var ffWinPlugin = document.getElementById("winFirefoxPlugin");
//var ov = ffWinPlugin.GetOfficeVersion();
// ffWinPlugin.EditDocument(path, ov);
//*********************************
window.location.replace('ms-powerpoint:ofe|u|' + path); //But this works for excel and powerpoint
} catch (e) {
alert(L_EditDocumentError_Text);
}
}
}
fNewDoc was a flag I set up at page load to determine whether the OpenDocument Control was initialized or not in IE.
The path is something like:
http://localhost/appName/EditDocument/cb72e81f-fb9c-40af-962b-aa981b79bb72/Test.pptx
The problem is this:
When I try to open an Excel/PowerPoint file by calling the EditDocument function above, using the FFWinPlugin or OpenDocument, it is not opened for editing properly. Both just open without protected view but cannot be edited.
In Excel, it does not show read-only mode, but when I tried saving, it says Document not Saved.
In PowerPoint, it opens in read-only mode.
I debugged to see the WebDAV Requests that was made, and it turns out that both of them only requests PROPFIND over and over again after the first OPTIONS.
While if I use the window.location.replace(.....), all 3 application (Word, Excel, PP) opens the documents fine, in protected view, and can be edited. Also, it follows the usual WebDAV Request cycle (OPTIONS-HEAD-OPTIONS-LOCK-GET-PROPFIND-UNLOCK). If I enable editing, it works just fine.
I tested the application first on Office 2013 (365), and for backward compatibility, I installed Office 2010 (I looked up online, and I know afterwards that this was a bad idea to have them side by side). And this whole problem occurs after I uninstalled the 2010 version a while ago.
I tested it on another computer, the problem did not occur. Tested also on an online WebDAV demo, and no problem occured as well. So it appears that the problem only happens between Excel/PowerPoint and the localhost.
I could have just use the working method to fix this, but it will make it inflexible, since I will have to have lots of if-else statement to determine which ms office application to use. While if I use the FFWinPlugin I don't have to take care of that. So I really want to know what's happening, but I have got nothing after looking up online for a while.
How can I fix this? At first I thought that the Office 2013 installation was corrupted after uninstalling 2010, but it works when not using the FFWinplugin. So, now I am not sure what went wrong.

ActiveX only working when IE 9 Console is activated

I'm building a small web application that needs to access Powerpoint through ActiveX and Javascript (and IE9...) to automatically build a report. I'm am using ActiveX because I can't generate the Powerpoint file on the server side (although I would have prefered this very much).
My code right now is very bare boned as I'm just beginning:
// Creating the ActiveX Powerpoint control
var ppt;
try{
ppt = new ActiveXObject("Powerpoint.Application");
}catch(e){
if (e instanceof ReferenceError)
alert("Your browser might not be compatible with this function. Please use Internet Explorer.");
else
alert("An error happened: " + e);
}
console.log("ActiveX Object created");
// Openning Powerpoint, make it visible
ppt.Visible = 1;
// Creating a new Presentation, and adding a blank (1 slide, 1 = ppLayoutBlank) Slide
ppt.Presentations.Add();
ppt.ActivePresentation.Slides.Add(1, 1);
On my computer, it happens that the ActiveX control doesn't launch Powerpoint even if I allow it to execute through the "An ActiveX control on this page might be dangerous; Do you allow it to execute?" (traduced straight from French).
But, if I launch the Developper Console, it magically runs. And, on another computer with IE 11, it works fine after I allowed the ActiveX control to execute.
I think my IE Security settings are right, thus I can't think of anything else that an IE glitch I'm not aware of. I'm working with IE 9.0.8112.16421 64-bit.
How could I get this code to run nicely? Thank you in advance!

Remind: console.log in IE works only if Developer console is open.
If the Developer Console is closes it stops the script because console is undefined.
In your code, try to change:
console.log("ActiveX Object created");
with
try{console.log("ActiveX Object created")}catch(err){} or comment the line with: //.

Dom Exception 18 in javascript/html5 when trying to access local storage

I have the following html that tries to set one key in local storage.
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<script>
document.addEventListener('DOMContentLoaded', loaded, false);
function loaded(){
try {
window.localStorage.setItem("Test", "SetItemValue");
document.getElementById("test").innerHTML = "Test OK";
} catch (err) {
document.getElementById("test").innerHTML = "Test FAIL<br>" + err.message;
}
}
</script>
</head>
<body>
<div id="test">Testing...</div>
</body>
</html>
On one single iPhone5 this causes the following exception.
Test FAIL SecurityError: DOM Exception 18
Other iPhones tested (three others) with the same iOs-version (7.0.2) works.
I have tested the above page from both a https://x.y.domain.tld and a http://x.domain.tld with the same exception.
Other questions concerning "DOM Exception 18" seem to be about security settings when eg. testing on localhost but linking in remote content over https. But this is a simple html page that simply tries to access local storage.

I read somewhere that if cookies are blocked, the DOM Exception 18 error shows up when setting localStorage. I was able to reproduce the error (not sure if I reproduced the issue, per se) on a simulator iPhone 5 (w/ iOS7) by going to the Settings, then for Safari, "Block Cookies" always. Don't know if that's how your iPhone 5 is configured though...

Problem was solved. It was revealed that the client (the errant phone was a client phone) uses a company-wide security platform installed on their iPhones. That platform has a separate web browser that must be used to enable every Javascript feature. The end user with the phone didn't know this so he used Safari that somehow is crippled when this platform is active. So the solution was to use the right application for browsing.
The platform was http://www.mobileiron.com/ and the secure browser is called Web#Work

I've seen that you can't change data in local storage within the first couple of seconds. Set a timer for 5000 milliseconds, and then run the setItem-function to see what happens.