Desktop notifications allowing not working on chrome - firefox

So i want my web page to promt for validation on desktop notifications when it loads. So i added onload in body...
<body onload="setAllowNotification() return false;">
This works jsut fine on mozilla firefox but in Google chrome it doesn't show the question. But if i call that function like this, it works.
<a onclick="setAllowNotification(); return false;" href="#">Click to set allow notifications</a>
If it helps my setAllowNotification function:
function setAllowNotification()
{
window.webkitNotifications.requestPermission(permissionGranted);
}
So any ideas?

Try adding a semicolon to your onload event inline code:
Check this answer actually...
Webkit notifications requestPermission function doesn't work
You can only use it as part of a response to a user action - i.e. you cannot do it "onload"

Related

Error: No reCAPTCHA clients exist (reCAPTCHA v3)

I've integrated reCAPTCHA v3 in one of my forms. In onload, there's a token produced and google captcha logo in the bottom right corner. But when I submit the form, in console there is an error shown, "Error: No reCAPTCHA clients exist". Also, it seems, no data is fetched by "g-recaptcha-response" and $_POST["g-recaptcha-response"] remains empty.
Here is the sample code:
<script type="text/javascript">
var ReCaptchaCallbackV3 = function() {
grecaptcha.ready(function() {
grecaptcha.execute("site_key").then(function(token) {
console.log("v3 Token: " + token);
});
});
};
</script>
<script src="https://www.google.com/recaptcha/api.js?onload=ReCaptchaCallbackV3&render=site_key"></script>
It doesn't produce any "g-recaptcha-response" when the form is submitted.
I don't know much about google reCaptcha. I've followed the documentation provided by them and used a site and a secret key in the proper way.
Can anybody please tell me where might be the problem and what is the possible solution?
I believe this error occurs when the reCaptcha api.js loads, but your container is not present on the page yet (at least for v2). I had this error occur in a React app when I navigated to the page rather than loading it as the first on. Instead of using render=explicit and using a global namespace onLoadCallback, I was able to resolve it by rendering the captcha element manually.
Instead of creating a <div class="g-recaptcha"></div>, give the container div an id only (<div id="recaptcha-container"></div>) and render it in your JS code (e.g. in componentDidMount for a React app):
grecaptcha.ready(function() {
grecaptcha.render("recaptcha-container", {
"sitekey": "your-site-key"
});
});
Have you tried loading the script before trying to send the request?
<script src="https://www.google.com/recaptcha/api.js?onload=ReCaptchaCallbackV3&render=site_key"></script>
<script type="text/javascript">
var ReCaptchaCallbackV3 = function() {
grecaptcha.ready(function() {
grecaptcha.execute("site_key").then(function(token) {
console.log("v3 Token: " + token);
});
});
};
</script>
When I came across this problem with reCAPTCHA v3, it was because I didn't pass it the correct site key.
This also happens in Recaptcha 2 before user interacts with it. So, I have a submit button that triggers a JS function that checks the value of recaptcha. To solve the no client exists problem, I did:
try {
data["reCaptcha"] = grecaptcha.getResponse();
} catch (err) {
data["reCaptcha"] = "";
}
The data object then gets sent to a back-end script that validates the recaptcha. The back-end also checks for the field being empty.
I had this problem because I was calling grecaptcha.reset(); when there wasn't any Recaptcha active on the site
grecaptcha.reset();
recaptcha__en.js:507 Uncaught Error: No reCAPTCHA clients exist.
at MX (recaptcha__en.js:507)
at Object.Zn [as reset] (recaptcha__en.js:514)
at <anonymous>:1:13
I was using React and only rendering my captcha container sometimes. Fixed by hiding the captcha button instead of not rendering it.
In my case grecaptcha.reset(); was present from previous code snippet, and I was programmatically invoking it.
As the captcha verification is going on the fly every time. Resetting wasn't required.
After eliminating this grecaptcha.reset(); my code works perfectly fine.
Maybe this hint can help someone.
We received this because we have a second environment with another domain and forgot to add this domain to the reCaptcha admin site. The solution was to add the new domain to the settings.
The steps are
Open www.google/recaptcha/admin/site
Select the site you're working on
Click on the settings gear
Add the domain in its respective section

Modernizr.videoautoplay object shows true, Modernizr.videoautoplay returning undefined

I'm using a custom Modernizr build, v3.3.0. I've created a simple JSFiddle example to illustrate: https://jsfiddle.net/cqkg7x45/6/.
console.log(Modernizr);
will show the Modernizr object, and when I inspect it in the JS console I can see "videoautoplay" is a property with a value of "true".
But, when I do
console.log(Modernizr.videoautoplay)
it returns "undefined".
I was originally seeing this issue in a WordPress theme I'm developing, but was also able to recreate in JSFiddle and a separate stand-alone HTML page. Also, Modernizr is putting the "videoautoplay" class on my HTML tag, even when I know the device does not support that feature (iPhone 5).
Update: This issue appears to be happening in Chrome (v47.0.2526.106), but not Firefox (v43.0.2).
I'm going to answer my own question in case anyone else runs into this problem. I found the solution on this SO post: How do I detect if the HTML5 autoplay attribute is supported?.
Since this is an "async" test you can't access the property using the syntax
Modernizr.videoautoplay
You have to use the .on() function, as shown in the above SO post:
Modernizr.on('videoautoplay', function(result){
if(result) {
alert('video autoplay is supported');
} else {
alert('video autplay is NOT supported');
}
});

IE8 issues with Yammer embed and API

Facing multiple issues with IE 8 (detailed version 8.0.7601.17514). Please note everything works fine in other browsers.
Yammer embed my feed control is not working. Sometimes it shows result and sometimes not.
REST API call not working and giving error as below. However I used new js sdk and new yam.platform.request.
Error is : yam.request is null or not an object. source : platform_js_sdk.js
Thanks in advance for your help!
I found out that the div that you embed yammer feed has to be above the yammer request script
eg.
<div id="embedded-feed" style="height:400px;width:500px;"></div>
<script>
yam.connect.embedFeed(
{ container: '#embedded-feed',
network: 'fourleaf.com' // network permalink (see below)
});
</script>
Otherwise, IE will not be able to find the div to show the feed (but chrome works fine..)

WatiN driving the IE "Are you sure you want to leave this page?" popup

I'd like to extend my WatiN automated tests to drive a page that guards against the user accidentally leaving the page without saving changes.
The page uses the "beforeunload" technique to seek confirmation from the user:
$(window).bind('beforeunload', function (event) {
if (confirmationRequired) {
return "Sure??";
}
});
My WatIn test is driving the page using IE. I cannot find a way to get WatIn to attach to the popup dialog so I can control it from my test.
All the following have failed (where the hard-coded strings refer to strings that I can see on the popup):
Browser.AttachTo<IE>(Find.ByTitle("Windows Internet Explorer");
browser.HtmlDialog(Find.FindByTitle("Windows Internet Explorer));
browser.HtmlDialog(Find.FindByTitle("Are you sure you want to leave this page?));
browser.HtmlDialog(Find.FindFirst());
Thanks!
You'll need to create and add the dialog handler.
Example Go to example site, click link, click leave page on confirmation dialog:
IE browser = new IE();
browser.GoTo("http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/onbeforeunload.htm");
WatiN.Core.DialogHandlers.ReturnDialogHandlerIe9 myHandler = new WatiN.Core.DialogHandlers.ReturnDialogHandlerIe9();
browser.AddDialogHandler(myHandler);
browser.Link(Find.ByUrl("http://www.microsoft.com")).ClickNoWait();
myHandler.WaitUntilExists();
myHandler.OKButton.Click();
browser.RemoveDialogHandler(myHandler);
The above is working on WatiN2.1, IE9, Win7. If using IE8 or before, you will likely need to use the ReturnDialogHandler object instead of the Ie9 specific handler

Firefox add-on: Injected HTML

I'm trying to write an add-on for firefox and i'm having a problem-
When the user right-clicking on the page the add-on is adding an element to the page's body using
document.body.appendChild(myElement);
myElement has a button and i want that "onClick" it will call a xmlHttpRequest and handle the response in some why. I've tried to inject the two scripts using
document.getElementsByTagName('head')[0].appendChild(xmlRequestFunction);
document.getElementsByTagName('head')[0].appendChild(handleResponseFunction);
but it didn't work because of (i assume) a security problem.
What can i do?
Thanks
Do not use onclick when working with content, use addEventListener instead (see https://developer.mozilla.org/en/XPCNativeWrapper#Limitations_of_XPCNativeWrapper if you need to know why). Like this:
myElement.addEventListener("click", function(event)
{
var request = new XMLHttpRequest();
...
}, false);

Resources