Skip to main content

How to Fix window.close() Not Working in JavaScript

A common point of confusion for web developers is why the window.close() method sometimes works and sometimes fails silently or with a console warning. The window.close() method might not work because modern browsers impose a strict security rule: a script can only close a window that was opened by that same script.

This guide will explain this security restriction, show you the correct and intended way to use window.close(), and provide practical fallbacks for situations where you cannot directly close the window.

The Core Problem: A Browser Security Restriction​

To prevent malicious scripts from closing a user's main browser window or tabs without their consent, browsers enforce a simple rule:

You can only programmatically close a window or tab if your script was the one that opened it using window.open().

This means you cannot reliably call window.close() on a user's main browser tab that they opened by typing a URL or clicking a link.

Problem: when you try to close a main browser window, it will likely fail.

// This will probably NOT work in most modern browsers.
let closeButton = document.getElementById('close-btn');

closeButton.addEventListener('click', () => {
  window.close(); // The script did not open this window.
});
note

In Firefox, you will see a clear console warning: Scripts may not close windows that were not opened by script. Chrome might not show an error, but the command will fail silently.

The Correct Use Case: Closing a Window Opened with window.open()​

The window.close() method is designed to work on pop-up windows or tabs that your application has created.

Solution: this is the standard, reliable pattern.

let myPopup; // Keep a reference to the new window

let openButton = document.getElementById('open-btn');
let closeButton = document.getElementById('close-btn');

openButton.addEventListener('click', () => {
  // Open a new window and store a reference to it.
  myPopup = window.open('about:blank', 'myPopup', 'width=400,height=300');
  myPopup.document.write("<h1>Hello from the popup!</h1>");
});

closeButton.addEventListener('click', () => {
  // ✅ Correct: We can close the window because our script opened it.
  if (myPopup) {
    myPopup.close();
  }
});
note

This is the intended and universally supported use of window.close().

The "Self-Opening" Hack (Limited Success)​

A common but unreliable "hack" is to try to "re-open" the current window into itself and then immediately close it.

The Unreliable Hack:

let closeButton = document.getElementById('close-btn');

closeButton.addEventListener('click', () => {
  // This is not guaranteed to work and is blocked by many browsers.
  window.open(window.location.href, '_self').close();
});
note

This trick used to work in older browsers but is no longer reliable and should not be used in modern web applications. It will fail in browsers like Firefox.

Practical Fallbacks for When close() is Not an Option​

If your goal is to create a "close" or "exit" button on a main page, you cannot reliably close the tab. Instead, you should provide a user-friendly alternative.

Redirecting to a "Closed" Page​

You can navigate the user to a blank or "Thank You" page, which gives the impression that the session has ended.

let exitButton = document.getElementById('exit-btn');

exitButton.addEventListener('click', () => {
  // Attempt to close the window (might work in some cases).
  window.close();

  // If `close()` fails, redirect the user after a short delay.
  setTimeout(() => {
    window.location.href = '/goodbye.html';
  }, 500);
});
note

This provides a better user experience than a button that does nothing.

Hiding the Page Content​

Another approach is to simply remove the page's content, leaving a blank screen.

let exitButton = document.getElementById('exit-btn');

exitButton.addEventListener('click', () => {
  // Attempt to close the window.
  window.close();
  
  // As a fallback, hide the body content.
  document.body.style.display = 'none';
});
note

This gives a visual cue that the page is "closed," even if the tab itself remains open.

Conclusion​

The window.close() method is a function with a very specific and restricted use case due to browser security policies.

  • It is only guaranteed to work on windows that were created by your script using window.open().
  • You cannot reliably close a main browser tab that the user opened themselves.
  • Avoid the unreliable "self-opening" hack (window.open(location, '_self').close()).
  • For "exit" buttons on a main page, provide a user-friendly fallback, such as redirecting to a confirmation page or hiding the page content.

Table of Contents