Learn how to change your browser title with JavaScript. Use it to send your user a message when they change to a different browser tab
This article was originally posted on dev.to.No intro just get to the code
document
object.
The code for this project is available on Github
App.js
file.
App
function called getBrowserHiddenProps
. This function will get the correct properties for us to use based on the browser we are on.
hidden
and visibilityChange
values using a shorthand method. By not defining the keys of the object, the keys will default to the variable name. Below would achieve the same effect as above.
App
function.
hidden
and visibilityChange
as an object. This was so we can deconstruct the return value of the getBrowserHiddenProps
function. We’re also checking to make sure that we are able to add an event listener to the document object and to ensure the hidden
value is not undefined
.
Next, we need to add the event listener based on the visibility event (visibilityChange
).
hidden
value and act of it. In our case, we’ll be asking the user to come back because we miss their attention.