Mixing
browser notification onclick event doesn't get fired in chrome
1
I am creating browser notifications, and it works great in firefox and edge. But for some reason it is not working in chrome. I can see the notification but when i click on the notification it doesn't get fired. This is my code:
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.onclick = function (event) {
alert("clicked");
event.preventDefault();
console.log('Notification clicked.');
}
}
}
So my question is, why the notificaion.onclick won't get triggered in chrome?
javascript notifications
asked Nov 20 '18 at 11:36
bruslibrusli
136
add a comment |
1
I am creating browser notifications, and it works great in firefox and edge. But for some reason it is not working in chrome. I can see the notification but when i click on the notification it doesn't get fired. This is my code:
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.onclick = function (event) {
alert("clicked");
event.preventDefault();
console.log('Notification clicked.');
}
}
}
So my question is, why the notificaion.onclick won't get triggered in chrome?
javascript notifications
asked Nov 20 '18 at 11:36
bruslibrusli
136
add a comment |
1
1
1
I am creating browser notifications, and it works great in firefox and edge. But for some reason it is not working in chrome. I can see the notification but when i click on the notification it doesn't get fired. This is my code:
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.onclick = function (event) {
alert("clicked");
event.preventDefault();
console.log('Notification clicked.');
}
}
}
So my question is, why the notificaion.onclick won't get triggered in chrome?
javascript notifications
asked Nov 20 '18 at 11:36
bruslibrusli
136
I am creating browser notifications, and it works great in firefox and edge. But for some reason it is not working in chrome. I can see the notification but when i click on the notification it doesn't get fired. This is my code:
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.onclick = function (event) {
alert("clicked");
event.preventDefault();
console.log('Notification clicked.');
}
}
}
So my question is, why the notificaion.onclick won't get triggered in chrome?
javascript notifications
javascript notifications
asked Nov 20 '18 at 11:36
bruslibrusli
136
asked Nov 20 '18 at 11:36
bruslibrusli
136
edited Nov 20 '18 at 13:26
brusli
asked Nov 20 '18 at 11:36
bruslibrusli
136
asked Nov 20 '18 at 11:36
bruslibrusli
136
asked Nov 20 '18 at 11:36
bruslibrusli
136
136
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
0
You are probably clicking the close button, it does not trigger the click event, try clicking on anything other than close button, try to use onclose event
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.onclick = function (event) {
alert("onClick!");
event.preventDefault();
console.log('Notification clicked.');
}
notification.onclose = function (event) {
alert("onClose!");
event.preventDefault();
console.log('Notification clicked.');
}
}
}
Or Try to use EventListener:
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.addEventListener("click", function (event) {
alert("onClick!");
event.preventDefault();
console.log('Notification clicked.');
} )
notification.addEventListener("close", function (event) {
alert("onClose!");
event.preventDefault();
console.log('Notification clicked.');
} )
}
}
answered Nov 20 '18 at 14:30
DemianDemian
1637
Close button works. If I click on close it closes the notification. But if I click anywhere else it opens a new window. And it does that only in chrome. In firefox and edge it displays an alert and it logs a message in console. When I debug and i put a break point inside notification.onclick, it does not go inside the function(in chrome, in others it works as expected). Thanks for your response.
– brusli
Nov 20 '18 at 14:37
very strange because I tested here and it worked everything except the close button, including to add the close button event, I had to add the event "onclose", I will update the answer
– Demian
Nov 20 '18 at 14:47
@brusli i have updated the answer
– Demian
Nov 20 '18 at 14:50
Are you testing it in google chrome? In edge and firefox it works.Chrome is the issue. I used your code and it is the same.
– brusli
Nov 20 '18 at 14:57
@brusli yes i have tested on Chrome, try to clean your js, or just execute on console by pressing f12
– Demian
Nov 20 '18 at 15:00
|
show 1 more comment
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53392168%2fbrowser-notification-onclick-event-doesnt-get-fired-in-chrome%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
0
You are probably clicking the close button, it does not trigger the click event, try clicking on anything other than close button, try to use onclose event
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.onclick = function (event) {
alert("onClick!");
event.preventDefault();
console.log('Notification clicked.');
}
notification.onclose = function (event) {
alert("onClose!");
event.preventDefault();
console.log('Notification clicked.');
}
}
}
Or Try to use EventListener:
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.addEventListener("click", function (event) {
alert("onClick!");
event.preventDefault();
console.log('Notification clicked.');
} )
notification.addEventListener("close", function (event) {
alert("onClose!");
event.preventDefault();
console.log('Notification clicked.');
} )
}
}
answered Nov 20 '18 at 14:30
DemianDemian
1637
Close button works. If I click on close it closes the notification. But if I click anywhere else it opens a new window. And it does that only in chrome. In firefox and edge it displays an alert and it logs a message in console. When I debug and i put a break point inside notification.onclick, it does not go inside the function(in chrome, in others it works as expected). Thanks for your response.
– brusli
Nov 20 '18 at 14:37
very strange because I tested here and it worked everything except the close button, including to add the close button event, I had to add the event "onclose", I will update the answer
– Demian
Nov 20 '18 at 14:47
@brusli i have updated the answer
– Demian
Nov 20 '18 at 14:50
Are you testing it in google chrome? In edge and firefox it works.Chrome is the issue. I used your code and it is the same.
– brusli
Nov 20 '18 at 14:57
@brusli yes i have tested on Chrome, try to clean your js, or just execute on console by pressing f12
– Demian
Nov 20 '18 at 15:00
|
show 1 more comment
0
You are probably clicking the close button, it does not trigger the click event, try clicking on anything other than close button, try to use onclose event
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.onclick = function (event) {
alert("onClick!");
event.preventDefault();
console.log('Notification clicked.');
}
notification.onclose = function (event) {
alert("onClose!");
event.preventDefault();
console.log('Notification clicked.');
}
}
}
Or Try to use EventListener:
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.addEventListener("click", function (event) {
alert("onClick!");
event.preventDefault();
console.log('Notification clicked.');
} )
notification.addEventListener("close", function (event) {
alert("onClose!");
event.preventDefault();
console.log('Notification clicked.');
} )
}
}
answered Nov 20 '18 at 14:30
DemianDemian
1637
Close button works. If I click on close it closes the notification. But if I click anywhere else it opens a new window. And it does that only in chrome. In firefox and edge it displays an alert and it logs a message in console. When I debug and i put a break point inside notification.onclick, it does not go inside the function(in chrome, in others it works as expected). Thanks for your response.
– brusli
Nov 20 '18 at 14:37
very strange because I tested here and it worked everything except the close button, including to add the close button event, I had to add the event "onclose", I will update the answer
– Demian
Nov 20 '18 at 14:47
@brusli i have updated the answer
– Demian
Nov 20 '18 at 14:50
Are you testing it in google chrome? In edge and firefox it works.Chrome is the issue. I used your code and it is the same.
– brusli
Nov 20 '18 at 14:57
@brusli yes i have tested on Chrome, try to clean your js, or just execute on console by pressing f12
– Demian
Nov 20 '18 at 15:00
|
show 1 more comment
0
0
0
You are probably clicking the close button, it does not trigger the click event, try clicking on anything other than close button, try to use onclose event
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.onclick = function (event) {
alert("onClick!");
event.preventDefault();
console.log('Notification clicked.');
}
notification.onclose = function (event) {
alert("onClose!");
event.preventDefault();
console.log('Notification clicked.');
}
}
}
Or Try to use EventListener:
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.addEventListener("click", function (event) {
alert("onClick!");
event.preventDefault();
console.log('Notification clicked.');
} )
notification.addEventListener("close", function (event) {
alert("onClose!");
event.preventDefault();
console.log('Notification clicked.');
} )
}
}
answered Nov 20 '18 at 14:30
DemianDemian
1637
You are probably clicking the close button, it does not trigger the click event, try clicking on anything other than close button, try to use onclose event
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.onclick = function (event) {
alert("onClick!");
event.preventDefault();
console.log('Notification clicked.');
}
notification.onclose = function (event) {
alert("onClose!");
event.preventDefault();
console.log('Notification clicked.');
}
}
}
Or Try to use EventListener:
function notifyMe(text) {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
body: text,
requireInteraction: true
});
notification.addEventListener("click", function (event) {
alert("onClick!");
event.preventDefault();
console.log('Notification clicked.');
} )
notification.addEventListener("close", function (event) {
alert("onClose!");
event.preventDefault();
console.log('Notification clicked.');
} )
}
}
answered Nov 20 '18 at 14:30
DemianDemian
1637
edited Nov 20 '18 at 14:50
answered Nov 20 '18 at 14:30
DemianDemian
1637
answered Nov 20 '18 at 14:30
DemianDemian
1637
answered Nov 20 '18 at 14:30
DemianDemian
1637
1637
Close button works. If I click on close it closes the notification. But if I click anywhere else it opens a new window. And it does that only in chrome. In firefox and edge it displays an alert and it logs a message in console. When I debug and i put a break point inside notification.onclick, it does not go inside the function(in chrome, in others it works as expected). Thanks for your response.
– brusli
Nov 20 '18 at 14:37
very strange because I tested here and it worked everything except the close button, including to add the close button event, I had to add the event "onclose", I will update the answer
– Demian
Nov 20 '18 at 14:47
@brusli i have updated the answer
– Demian
Nov 20 '18 at 14:50
Are you testing it in google chrome? In edge and firefox it works.Chrome is the issue. I used your code and it is the same.
– brusli
Nov 20 '18 at 14:57
@brusli yes i have tested on Chrome, try to clean your js, or just execute on console by pressing f12
– Demian
Nov 20 '18 at 15:00
|
show 1 more comment
Close button works. If I click on close it closes the notification. But if I click anywhere else it opens a new window. And it does that only in chrome. In firefox and edge it displays an alert and it logs a message in console. When I debug and i put a break point inside notification.onclick, it does not go inside the function(in chrome, in others it works as expected). Thanks for your response.
– brusli
Nov 20 '18 at 14:37
very strange because I tested here and it worked everything except the close button, including to add the close button event, I had to add the event "onclose", I will update the answer
– Demian
Nov 20 '18 at 14:47
@brusli i have updated the answer
– Demian
Nov 20 '18 at 14:50
Are you testing it in google chrome? In edge and firefox it works.Chrome is the issue. I used your code and it is the same.
– brusli
Nov 20 '18 at 14:57
@brusli yes i have tested on Chrome, try to clean your js, or just execute on console by pressing f12
– Demian
Nov 20 '18 at 15:00
Close button works. If I click on close it closes the notification. But if I click anywhere else it opens a new window. And it does that only in chrome. In firefox and edge it displays an alert and it logs a message in console. When I debug and i put a break point inside notification.onclick, it does not go inside the function(in chrome, in others it works as expected). Thanks for your response.
– brusli
Nov 20 '18 at 14:37
Close button works. If I click on close it closes the notification. But if I click anywhere else it opens a new window. And it does that only in chrome. In firefox and edge it displays an alert and it logs a message in console. When I debug and i put a break point inside notification.onclick, it does not go inside the function(in chrome, in others it works as expected). Thanks for your response.
– brusli
Nov 20 '18 at 14:37
very strange because I tested here and it worked everything except the close button, including to add the close button event, I had to add the event "onclose", I will update the answer
– Demian
Nov 20 '18 at 14:47
very strange because I tested here and it worked everything except the close button, including to add the close button event, I had to add the event "onclose", I will update the answer
– Demian
Nov 20 '18 at 14:47
@brusli i have updated the answer
– Demian
Nov 20 '18 at 14:50
@brusli i have updated the answer
– Demian
Nov 20 '18 at 14:50
Are you testing it in google chrome? In edge and firefox it works.Chrome is the issue. I used your code and it is the same.
– brusli
Nov 20 '18 at 14:57
Are you testing it in google chrome? In edge and firefox it works.Chrome is the issue. I used your code and it is the same.
– brusli
Nov 20 '18 at 14:57
@brusli yes i have tested on Chrome, try to clean your js, or just execute on console by pressing f12
– Demian
Nov 20 '18 at 15:00
@brusli yes i have tested on Chrome, try to clean your js, or just execute on console by pressing f12
– Demian
Nov 20 '18 at 15:00
|
show 1 more comment
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53392168%2fbrowser-notification-onclick-event-doesnt-get-fired-in-chrome%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
