# Can we make custom oneboxes?

**URL:** https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463
**Category:** Support
**Created:** [October 12, 2016, 8:01pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463 "2016-10-12T20:01:34Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![trusktr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trusktr/32/116841_2.png) [@trusktr](https://meta.discourse.org/u/trusktr)
#### Post date: [October 12, 2016, 8:01pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/1 "2016-10-12T20:01:35Z")

</div>

I’d like to embed a jsfiddle in a conversation. How can we do that?

The iframe embed code looks like:

```plaintext
<iframe width="100%" height="300" src="//jsfiddle.net/trusktr/32cnvse3/embedded/" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

```

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [October 12, 2016, 8:05pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/2 "2016-10-12T20:05:16Z")

</div>

Codepen is whitelisted by default:

https://codepen.io/jarrodthibodeau/embed/preview/EgPVpV?default-tabs=css%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=EgPVpV

Maybe we can test jsfiddle, let me check.

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [October 12, 2016, 11:30pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/3 "2016-10-12T23:30:33Z")

</div>

> [@Falco](#):
>
> Maybe we can test jsfiddle, let me check.

The big thing that needs testing is that there is 0 JS execution prior to a user clicking “run”. We can not risk people setting up JavaScript bombs.

---

<div class="post-metadata">

### Author: ![Mittineague](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mittineague/32/114259_2.png) [@Mittineague](https://meta.discourse.org/u/Mittineague)
#### Post date: [October 12, 2016, 11:57pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/4 "2016-10-12T23:57:20Z")

</div>

> [@sam](#):
>
> We can not risk people setting up JavaScript bombs.

Yes, at SitePoint we onebox codepens, but fiddles are only linked to.

It works well, and so far, AFAIK hasn’t introduced risk.

[https://www.sitepoint.com/community/t/css-hover-transition/238497/3?u=mittineague](https://www.sitepoint.com/community/t/css-hover-transition/238497/3?u=mittineague)

[https://www.sitepoint.com/community/t/classname-changes-depending-on-distance-window-has-scrolled/238092/2?u=mittineague](https://www.sitepoint.com/community/t/classname-changes-depending-on-distance-window-has-scrolled/238092/2?u=mittineague)

---

<div class="post-metadata">

### Author: ![trusktr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trusktr/32/116841_2.png) [@trusktr](https://meta.discourse.org/u/trusktr)
#### Post date: [October 13, 2016, 7:23am UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/5 "2016-10-13T07:23:54Z")

</div>

> [@sam](#):
>
> JavaScript bombs

What are those? Something that makes the CPU work 100%?

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [October 13, 2016, 9:10am UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/6 "2016-10-13T09:10:49Z")

</div>

> [@trusktr](#):
>
> What are those? Something that makes the CPU work 100%?

Well unrestricted JS can lead to an enormous class of issues, leaking confidential info via JSONP, high CPU when you hit a topic, trick users into thinking the page has information on it that is fake, phishing, the sky is the limit.

---

<div class="post-metadata">

### Author: ![Mittineague](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mittineague/32/114259_2.png) [@Mittineague](https://meta.discourse.org/u/Mittineague)
#### Post date: [October 13, 2016, 3:32pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/7 "2016-10-13T15:32:36Z")

</div>

For a simple harmless example that is more representative of a common JavaScript newbie mistake than a malicious script, try running this and see how well you like it

```plaintext
for (var i = 0; i < 1000; i++) {
 alert(i);
}

```

My bet is you close your browser or stop scripts well before it completes.

---

<div class="post-metadata">

### Author: ![trusktr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trusktr/32/116841_2.png) [@trusktr](https://meta.discourse.org/u/trusktr)
#### Post date: [May 25, 2017, 6:20pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/9 "2017-05-25T18:20:44Z")

</div>

What exactly is different about codepen compared to jsfiddle that makes only codepen embeddable? Can’t both run javascript, and don’t both run in a iframe?

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [May 25, 2017, 6:24pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/10 "2017-05-25T18:24:15Z")

</div>

> [@trusktr](#):
>
> What exactly is different about codepen compared to jsfiddle that makes only codepen embeddable? Can’t both run javascript, and don’t both run in a iframe?

> [@Embed playbuzz quiz into post](https://meta.discourse.org/t/embed-javascript-code/59183/6):
>
> Codepen is a good netizen and only executes random JS when you click on the play button.

---

<div class="post-metadata">

### Author: ![trusktr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trusktr/32/116841_2.png) [@trusktr](https://meta.discourse.org/u/trusktr)
#### Post date: [May 25, 2017, 6:26pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/11 "2017-05-25T18:26:01Z")

</div>

Testing codepen bomb attempt:

---

<div class="post-metadata">

### Author: ![trusktr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trusktr/32/116841_2.png) [@trusktr](https://meta.discourse.org/u/trusktr)
#### Post date: [May 25, 2017, 6:26pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/12 "2017-05-25T18:26:42Z")

</div>

Well, apparently codepen iframe embed doesn’t work.

How about HTML:

See the Pen [JS Bomb Example](https://codepen.io/trusktr/pen/JNzzKQ/) by Joseph Orbegoso Pea ([@trusktr](https://codepen.io/trusktr)) on [CodePen](https://codepen.io).

---

<div class="post-metadata">

### Author: ![trusktr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trusktr/32/116841_2.png) [@trusktr](https://meta.discourse.org/u/trusktr)
#### Post date: [May 25, 2017, 6:27pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/13 "2017-05-25T18:27:06Z")

</div>

Nope. How about URL:

[https://codepen.io/trusktr/pen/JNzzKQ](https://codepen.io/trusktr/pen/JNzzKQ)

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [May 25, 2017, 6:28pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/14 "2017-05-25T18:28:00Z")

</div>

Like all oneboxes, you are supposed to paste a link on a line by itself.

And as you can see it doesn’t run until clicked.

---

<div class="post-metadata">

### Author: ![trusktr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trusktr/32/116841_2.png) [@trusktr](https://meta.discourse.org/u/trusktr)
#### Post date: [May 25, 2017, 6:29pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/15 "2017-05-25T18:29:03Z")

</div>

Interesting, and I don’t see the result (infinite while loop that alerts).

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [May 25, 2017, 6:31pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/16 "2017-05-25T18:31:16Z")

</div>

> [@trusktr](#):
>
> Interesting, and I don’t see the result (infinite while loop that alerts).

It’s blocked by the sandbox for iframes since Chrome 46.

---

<div class="post-metadata">

### Author: ![trusktr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trusktr/32/116841_2.png) [@trusktr](https://meta.discourse.org/u/trusktr)
#### Post date: [May 25, 2017, 6:33pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/17 "2017-05-25T18:33:51Z")

</div>

If we click “Edit on codepen” then it runs the code for the first time without the infinite loop detection!

---

<div class="post-metadata">

### Author: ![trusktr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trusktr/32/116841_2.png) [@trusktr](https://meta.discourse.org/u/trusktr)
#### Post date: [May 25, 2017, 6:35pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/18 "2017-05-25T18:35:57Z")

</div>

codepen console.log bomb:

[https://codepen.io/trusktr/pen/oWVVqb](https://codepen.io/trusktr/pen/oWVVqb)

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [May 25, 2017, 6:36pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/19 "2017-05-25T18:36:40Z")

</div>

> [@trusktr](#):
>
> If we click “Edit on codepen” then it runs the code for the first time without the infinite loop detection!

But then you are on the codepen website right? What does this has to do with Discourse?

---

<div class="post-metadata">

### Author: ![trusktr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trusktr/32/116841_2.png) [@trusktr](https://meta.discourse.org/u/trusktr)
#### Post date: [May 25, 2017, 6:38pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/20 "2017-05-25T18:38:01Z")

</div>

Nothing unless the whole browser crashes. x} Probably Chrome won’t crash, but maybe some other browser?

Testing document.write bomb:

[https://codepen.io/trusktr/pen/WjmmJJ](https://codepen.io/trusktr/pen/WjmmJJ)

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [May 25, 2017, 6:38pm UTC](https://meta.discourse.org/t/can-we-make-custom-oneboxes/51463/21 "2017-05-25T18:38:22Z")

</div>

Use [try.discourse.org](http://try.discourse.org) for testing, meta is for discussions.
