Issues arise after the update of Chrome causing JavaScript to malfunction

Often, I find myself accidentally closing my Chrome browser and having to go through the tedious process of reopening and reloading all the tabs I had been working on. Frustrated with Chrome's lack of a built-in confirmation mechanism before closing, I took matters into my own hands by creating a simple page that prompts for confirmation before the browser is closed. I keep this page open alongside my other tabs.

<!DOCTYPE html>
<html>
    <body>
    <p>This page serves to prevent accidental closure of Chrome.</p>
        <script language="JavaScript">

            window.onbeforeunload = function () {
                return "Are you sure?";
            };
        </script>
    </body>
</html>

However, after updating my Chrome browser from version 56 to 60, the code no longer functions as intended. It no longer asks for confirmation before closing, despite trying various solutions found online without success.

Disclaimer: I am relatively new to web development.

Answer №1

As stated in the MDN documentation:

To prevent unwanted pop-ups, certain browsers may not show prompts created in beforeunload event handlers unless there has been interaction with the page; in some cases, they may not display them at all.

It appears that your function may not run reliably, especially with Chrome 60 which enforces the behavior mentioned above. According to the information provided:

Starting from Chrome version 60 onwards, the beforeunload dialog will only be shown if the frame attempting to display it has received a user gesture or interaction (or if any embedded frame has also received such a gesture).

If you wish to continue using this method, it might be necessary to interact with the page during your session.

Alternatively, to reopen all recently closed tabs when restarting Chrome, you can simply press Ctrl-Shift-T.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Having difficulty uploading files using FormData in JavaScript, as $_FILES is returning empty

I have implemented a file upload feature to my server using JavaScript, but I am facing an issue with certain jpeg/png files where the $_FILES and $_POST variables are empty. Despite trying various solutions, I haven't been able to resolve this issue. ...

Trouble with Updating InnerHTML

xmlHttp = new XMLHttpRequest(); xmlHttp.open( "GET", "myurlhere.php", true ); xmlHttp.send(); var display = document.getElementById("display"); display.innerHTML = xmlHttp.response; This snippet of code is part of a function triggered by a button click. ...

MongoDB Integration of Collections - No Data Population

Having trouble merging a client and an account collection. When I use res.send(client), only the account id's are returned. Unsure how to include account information in clients. Have seen one to many solutions, but struggling with this two-way relati ...

Error when compiling TypeScript: The callback function provided in Array.map is not callable

This is a Node.js API that has been written in Typescript. app.post('/photos/upload', upload.array('photos', 12), async (req, res) => { var response = { } var list = [] try { const col = await loadCollection(COLLECTION_NAM ...

I'm trying to use Route.get() but it seems I forgot to include a callback function. What mistake did I make?

I've searched through various answers on different platforms, but I'm still struggling to understand. What mistake have I made? Can someone provide assistance? *revised. I have included requiring routes and app.use. It seems like the function is ...

Are the stylesheets on my computer also applicable to Chrome?

For instance, an anchor tag by default has specific styles such as being blue, turning purple when visited, and changing the cursor when hovered over. So, where exactly does Chrome pull these styles from? Could there be a Google Chrome style-sheet stored ...

Tips for presenting hierarchical information from my database in ejs

I'm currently working on a genealogy application using node js express and ejs but I'm facing an issue with displaying the database in order (starting from parent). This is the code snippet for retrieving my data and what I see when I log the ou ...

Retrieve the present value from a Selectpicker using jQuery within the Codeigniter Framework

I attempted to use DOM manipulation to retrieve the value of the currently selected option from the selectpicker. My goal was to have the value of the selectpicker id="service_provider_select" printed first. However, whenever I changed the option using the ...

What is the best way to cause a ball to collide with a triangle power-up on a canvas

I'm currently facing an issue with the power up feature in my game. Despite successfully displaying the shape on screen, the ball fails to speed up as expected upon collision with the shape. <html> <title>Level Selector</title& ...

Need a place to keep your data safe while using nodejs?

I have taken on the task of developing a lastfm plugin for a chat bot that my friend created. One feature I want to include is the ability for users to register their hostmask/nick with their lastfm username (for example, using the command !reg lastfmuser ...

Creating pages or tabs within a table using HTML5 and Angular is a simple and effective way to organize

I have a REST response that returns around 500 records. These records are being displayed in an Angular table. I would like to add customization options for the user, allowing them to choose to display 10/20/30... records per page. Additionally, I want to ...

Is the straightforward AJAX functionality I've implemented in my personal library enough?

Here's the specific code we're looking at: ajax = function(url, cb) { xhr = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject('MicrosoftXMLHTTP'); xhr.onreadystatechange = function() { ...

What could be causing the lack of data to be returned by jQuery.getJSON?

I've come across this method: function getUserName(guid) { var name = "Unknown"; $.getJSON(urlCurrent, { "method" : "get_user_info", "guid" : guid, "auth_token" : temporaryAuthToken }, function(data) { if ...

Error in Firefox when converting a string to a date in JavaScript using the format mm-dd-yyyy

Hi, I am encountering an issue with converting a string in the format mm-dd-yyyy into a date object. While it works perfectly fine in Internet Explorer and Chrome, it does not work in Firefox as it returns an invalid date at times. I have also tried using ...

An error occurred due to a missing value within the forEach loop

In my JavaScript object, I am encountering an issue with a key. resolve: function () { var result = this.initialValue; console.log('initial value:',result); // 5 this.functions.forEach(function (element, index) { ...

Encountering a problem while trying to pin a message on Discord

Whenever a message is pinned in discord, it causes the bot to crash with the following error (although it can recover with forever but that's beside the point). The pinned message can be of any type (regular or embed). if (!value) throw new RangeE ...

What is the method for combining two SC.RecordArray instances in Sproutcore?

Below is the code snippet : queryTree = SC.Query.local('Tree.Category', "categoryId = {categoryId}", { categoryId: this.get('guid'), orderBy: "name ASC" }); queryNote = SC.Query.l ...

retrieving specific values from a row in an HTML table and converting them into a JSON array

function extractRowData(rowId) { const row = [...document.querySelectorAll("#stockinboundedittable tr")].find(tr => tr.id === rowId); const rowData = Object.fromEntries( [...row.querySelectorAll("input")].slice(1).map(inp => [inp.id.replace(/ ...

issues arising from a growing css division

I am facing an issue where the tiles on my webpage expand on hover, but some of them are partially covered by neighboring tiles. How can I resolve this problem? Here is the CSS code snippet: .tile { position: absolute; width: 86px; background-color ...

Having trouble understanding how to display an HTML file using Next.JS?

Currently, I am working on a project that involves utilizing Next.JS to develop a webpage. The main goal is to display a PDF file on the left side of the screen while integrating Chaindesk on the right side to create a chat bot capable of extracting inform ...