22

Whenever running alert('something') in JSFiddle, I get the error:

Ignored call to 'alert()'. The document is sandboxed, and the 'allow-modals' keyword is not set.

in the console.

I cannot find any information on this error through Google.

How do I fix this? What is, and where can I set, the 'allow-modals' keyword?

ᔕᖺᘎᕊ
  • 2,971
  • 3
  • 23
  • 38
  • 1
    This is the sandbox iframe attribute. – Daniel A. White Aug 20 '15 at 13:23
  • @DanielA.White Ahh - I see! I just added `allow-modals` via Dev Tools and it worked! You can add that as an answer :) But I swear this used to work - is this a new change JSFiddle has done? Is there any way to fix it without manually editing it every time/without having to create a userscript or similar to do it? – ᔕᖺᘎᕊ Aug 20 '15 at 13:25

2 Answers2

26

IFrame sandboxing is a technique that helps protect from outside content creating confusing popups that would appear to come from the main website. To allow alert popups you will need to find the iframe tag, and modify the sandbox attribute to contain the allow-modals value. For JSFiddle this is the iframe named "result". You will need to Re-Run (ctrl-enter) your Fiddle after modifying the tag.

Using web browser Developer Tools or something like Grease Monkey/Tamper Monkey change the iframe.

From this:

<iframe name="result" sandbox="allow-forms allow-popups allow-scripts allow-same-origin" frameborder="0">

To this:

<iframe name="result" sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin" frameborder="0">

The following TamperMonkey snippet seems to do the trick nicely:

// ==UserScript==
// @name         Enable alert()s
// @match        //jsfiddle.com/*
// @require      http://code.jquery.com/jquery-latest.min.js
// @grant        unsafeWindow
// ==/UserScript==
this.$ = this.jQuery = jQuery.noConflict(true);
$("iframe[name='result']").each(function() {
    this.sandbox += ' allow-modals';
});
pierce.jason
  • 750
  • 6
  • 11
2

That is something JSFiddle must have changed to its iframes to add the sandbox attribute. Or Chrome must have added support allow-modals.

Actually it is something new for Chrome 46+:

Daniel A. White
  • 187,200
  • 47
  • 362
  • 445
  • 1
    These links describe what sandbox and allow-modals are. They do not address where to set allow-modals or how to implement a workaround for JSFiddle. – pierce.jason Sep 22 '15 at 15:44