As mentioned here: https://twitter.com/marcfallows/status/552475767503085568

I can create a Plunker with the "@" symbol in the file name. The Plunker runs as expected, but I can't save.

Repro steps:

1. Create a new Plunker
2. Add "New file" named "foo@bar"
3. Plunker still runs properly
4. Press "Save" button to save the Plunker

EXPECTED: Plunker to save
ACTUAL: Get an error "Save failed: Save failed"

1. Double-click on a file in left-side explorer.
2. You get a "rename" dialog
3. Hit "cancel"
4. File is deleted!

Unable to load streaming code when trying to stream.

Chrome Version 35.0.1916.99 beta; no extensions enabled

When opening the editor, and then clicking a package version to add (not actually adding the package though), after a few seconds I get this (infinitely):

Uncaught object editor-0.7.27.js:2
s.$digest editor-0.7.27.js:2
s.$apply editor-0.7.27.js:2
(anonymous function) editor-0.7.27.js:26

Error: 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: [["fn: function (){s=l(o);var e,t;if(y(s))if(r(s))for(n!==c&&(n=c,h=n.length=0,a++),e=s.length,h!==e&&(a++,n.length=h=e),t=0;e>t;t++)n[t]!==s[t]&&(a++,n[t]=s[t]);else{n!==u&&(n=u={},h=0,a++),e=0;for(t in s)s.hasOwnProperty(t)&&(e++,n.hasOwnProperty(t)?n[t]!==s[t]&&(a++,n[t]=s[t]):(h++,n[t]=s[t],a++));if(h>e)for(t in a++,n)n.hasOwnProperty(t)&&!s.hasOwnProperty(t)&&(h--,delete n[t])}else n!==s&&(n=s,a++);return a}; newVal: 284; oldVal: 282"],["fn: function (){s=l(o);var e,t;if(y(s))if(r(s))for(n!==c&&(n=c,h=n.length=0,a++),e=s.length,h!==e&&(a++,n.length=h=e),t=0;e>t;t++)n[t]!==s[t]&&(a++,n[t]=s[t]);else{n!==u&&(n=u={},h=0,a++),e=0;for(t in s)s.hasOwnProperty(t)&&(e++,n.hasOwnProperty(t)?n[t]!==s[t]&&(a++,n[t]=s[t]):(h++,n[t]=s[t],a++));if(h>e)for(t in a++,n)n.hasOwnProperty(t)&&!s.hasOwnProperty(t)&&(h--,delete n[t])}else n!==s&&(n=s,a++);return a}; newVal: 286; oldVal: 284"],["fn: function (){s=l(o);var e,t;if(y(s))if(r(s))for(n!==c&&(n=c,h=n.length=0,a++),e=s.length,h!==e&&(a++,n.length=h=e),t=0;e>t;t++)n[t]!==s[t]&&(a++,n[t]=s[t]);else{n!==u&&(n=u={},h=0,a++),e=0;for(t in s)s.hasOwnProperty(t)&&(e++,n.hasOwnProperty(t)?n[t]!==s[t]&&(a++,n[t]=s[t]):(h++,n[t]=s[t],a++));if(h>e)for(t in a++,n)n.hasOwnProperty(t)&&!s.hasOwnProperty(t)&&(h--,delete n[t])}else n!==s&&(n=s,a++);return a}; newVal: 288; oldVal: 286"],["fn: function (){s=l(o);var e,t;if(y(s))if(r(s))for(n!==c&&(n=c,h=n.length=0,a++),e=s.length,h!==e&&(a++,n.length=h=e),t=0;e>t;t++)n[t]!==s[t]&&(a++,n[t]=s[t]);else{n!==u&&(n=u={},h=0,a++),e=0;for(t in s)s.hasOwnProperty(t)&&(e++,n.hasOwnProperty(t)?n[t]!==s[t]&&(a++,n[t]=s[t]):(h++,n[t]=s[t],a++));if(h>e)for(t in a++,n)n.hasOwnProperty(t)&&!s.hasOwnProperty(t)&&(h--,delete n[t])}else n!==s&&(n=s,a++);return a}; newVal: 290; oldVal: 288"],["fn: function (){s=l(o);var e,t;if(y(s))if(r(s))for(n!==c&&(n=c,h=n.length=0,a++),e=s.length,h!==e&&(a++,n.length=h=e),t=0;e>t;t++)n[t]!==s[t]&&(a++,n[t]=s[t]);else{n!==u&&(n=u={},h=0,a++),e=0;for(t in s)s.hasOwnProperty(t)&&(e++,n.hasOwnProperty(t)?n[t]!==s[t]&&(a++,n[t]=s[t]):(h++,n[t]=s[t],a++));if(h>e)for(t in a++,n)n.hasOwnProperty(t)&&!s.hasOwnProperty(t)&&(h--,delete n[t])}else n!==s&&(n=s,a++);return a}; newVal: 292; oldVal: 290"]]
    at Error (native)
    at Object.s.$digest (http://plnkr.co/js/apps/editor-0.7.27.js:2:12540)
    at Object.s.$apply (http://plnkr.co/js/apps/editor-0.7.27.js:2:13242)
    at http://plnkr.co/js/apps/editor-0.7.27.js:26:6249 editor-0.7.27.js:1
(anonymous function) editor-0.7.27.js:1
(anonymous function) editor-0.7.27.js:1
s.$apply editor-0.7.27.js:2
(anonymous function) editor-0.7.27.js:26

HI, I think it would be better if I can change or delete a template I saved in the templates tab, or even have versions of the same template, so basically a template will be a regular plunker saved but marked as template so the user can perform the regular plunker actions on it (change delete...).

I'm a huge fan of this tool. Made the switch to a Macbook Pro, and now it's hard to use.

Steps to reproduce

1. Open the editor: http://plnkr.co/edit/?p=catalogue
2. Click the "add" magic wand on any library in the pane on the right.

Symptoms:

• Editor panel goes "blank".
• No errors shown in console.
• No failed network requests in Network tab
• Unable to edit input.html in editor, while other files like script.js are fine.

Chrome version details:

Working with an angular example, tidy is munging my angular in page templates, placing spaces between most things.

<script type="text/ng-template" id="tempTest">
  <input type="date" data-ng-model="TestDate" / >
</script>

becomes

<script type="text/ng-template" id="tempTest">
  < input type = "date"
  data - ng - model = "TestDate" / >
</script>

So if you add "bootstrap-css" for example in your .html and you click on the wand again, a random element will get an extra indentation.

like jsbin/jsfiddle ;)

with #25 it can be useful to demonstrate compiled languages

Hi,

I have a "playground" on my site, for html/js/css, similar to plunker. There are many examples and many people browsing them. It's well tested, but needs rewrite, I even started it with Angular when I found plunker.

So now I'm considering switching to plunker instead of making a new playground of my own, but there's a problem (see below).

The thing is: many examples contain additional resources, mostly gif/png images. For example, index.html may contain <img src="ball.gif"> where ball.gif is in the same folder.

Currently plnkr does not support binary files at all (correct me if I'm wrong). And in fact, they shouldn't go to plnkr, because no one ever edits them, hence they may be called resources.

So, relative links like <img src="ball.gif"> are not going to work in plnkr. And I can't make them absolute, because examples should be downloadable as a whole and runnable offline.

As a possible solution I see an enhancement to plnkr which allows supplying a list of "resources", which are mappings "relative url -> remote url", e.g. "ball.gif -> http://learn.javascript.ru/example/ball.gif" or even "resources/(.*) -> http://learn.javascript.ru/example/resources/$1". Plnkr would redirect resources to their origin.

If that were possible, I would POST a list of resources with the example and plnkr server would reply for "ball.gif" request with 302 redirect to http://learn.javascript.ru/example/ball.gif.

Is that an easy enhancement to plnkr or I should fork plnkr for my site or you'd advice to forget thinking about the switch?

When I open http://plnkr.co/edit/ - I see catalogue at the right side.
When I open http://plnkr.co/edit/gist:6982344 - I also see catalogue at the right side INSTEAD of the preview which I actually want.

All online sandboxes: jsfiddle, jsbin, codepen etc are showing code + preview, because that's what people are coming for.

Catalogue is an addon, which may be needed, yes, but preview is a de-facto standard and much more sane starting point.

Now I'm trying to move a big JS tutorial project to plunker and I see that people would really prefer to get a preview by default.

Please consider changing to preview as the starting point.

Hello,

I'd like to make a tiny utility written in Node.JS that will submit directory contents to plunker, like https://github.com/defunkt/gist does for gist.

Is there anything that already does the job?

I get this message when trying to access plnkr.co.

Nodejitsu
400
www.plnkr.co is currently stopped

Temporarily down for maintenance?

Tried to save a plunk with a tag containing a dot ("snap.svg") and it failed although the tag name was in the suggestions list. Maybe this issue applies to other characters as well?

According to the code, lot's of errors on permalinks.

The server is not responding...
Is there any issue with Plunker?

I've just encountered a bug in a dev version of chrome seemingly unrelated to plnkr that caused me to reload multiple times.
The session restore option only appears on the first reload, but any reloading after that doesn't give the option.
Would it be better if the session restore was still available until explicitly declined or until properly saved?

Clicking the Mailing List link on http://plnkr.co/ loads a blank plunk instead of the Plunkr Google Group

At this moment, plnkr.co hangs, curl can't connect.

I was wondering if I could refresh the preview pane while I am within editor.
currently I can use Ctrl+Enter to run and stop. (two steps, and pane hides and comes back)

I have seen there is a refresh button in the preview pane that uses refresh() function, can we bind it to a shortcut?
I am sorry, if it seems noob, I am not very familiar with .jade and .coffee scripts.

When I open a Gist, plunker preformats it, so editing starts with a preformatted (ugly) code instead of the original (nice) one.

Expected: naturally, when I open a gist, I expect plunker to open & edit the original file.

Let me know if you need more input, examples etc.

http://plnkr.co/edit/wmuAWw?p=options

a simple barebones index.jade just renders as internal server error

This is a feature request to add the ability to link to a past version of a particular plunk.

I asked about this on webapps.stackexchange, but it appeared that this was not yet a feature.

For example, for this plunk, all three versions resolve to the same url:
http://plnkr.co/edit/ZudJcIak5sAWuiq3b1Hu?p=preview

Perhaps you could add a query parameter to the end of the url ?v=1 and then use that to revert to past versions. Here's some sample code (although there might be more things in play):

function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
function revertVersion() {
    var urlVersion = getParameterByName('v');
    var numVersions = $scope.session.plunk.history.length
    if (IsNumeric(urlVersion ) && urlVersion <= numVersions) {
        // invert because revs listed in descending order
        var index = numVersions - urlVersion + 1;
        $scope.revertTo(index);
    }
}

How about to add "charset: utf-8" in Content-Type header from server?

Right now, there's no charset from server, just content-type, so browser treats it as charset=us-ascii.

Maybe use utf-8 as a widespread and useful default?

not quite sure if it's the corect place for this but i can access plunks set by owners as private

This used to be at plunker.no.de/documentation (see my tweet from April 2012)

I believe that link when here, but don't quite remember.

Regardless, it'd be great to document how to create Plunks outside the UI.

plnkr.co Site Down from nearly 2 hours (I personally have been observing).

http://www.isitdownrightnow.com/plnkr.co.html

Please Resolve this....

Please add licence file to all the plunker subpackages

Thanks

Steps to reproduce:

1. Visit http://plnkr.co/edit/YbS14H?p=preview
2. click Twitter icon
3. get link like http://plnkr.co/edit/YbS14H?p=preview#.UYmEZIQ-TTg.twitter
4. Try to load http://plnkr.co/edit/YbS14H?p=preview#.UYmEZIQ-TTg.twitter in a new tab or window
5. watch URL get changed (in 2 or 3 steps) to http://plnkr.co/edit.UYmEZIQ-TTg.twitter
6. wait for page to load (it won't)

I'm not sure if this issue is limited to certain types of URLS (e.g., with ?p=preview) or extends to the URLs generated by the other share buttons, but it reliably happens with this URL.

the embed frontend allows linking to a specific file, but the editor UI doesn't seem to have something like that

Our lovely template, AKA http://plnkr.co/edit/gist:3510140 works good on chrome, but on firefox, it is missing the ng-app='plunker' on the html tag.

Weird bug :P

I didn't check the source code yet but it looks like there is a bug with the date on this page:

I clicked "View the detailed information about this Plunk":

I saw the tooltips being "stucked" there forever.

I think that only happens when you fail with your github login, or a save / fork fails... But not on success.

Hi,

I want to use plnkr to let users instantly edit examples from my site. These examples are stored on my site because they may contain binary files.

I've read about POST /edit/ in Readme and the source. But how am I supposed to use it?

If I POST using XHR then I get a page... Do you mean that I must embed it somehow?

I can't submit < form method="POST" action="http://plnkr.co/edit/">, because browsers do not allow to pass JSON with it. If I could, I would just create a form and submit it.

So, how am I supposed to use the /edit/ functionality? Maybe it should be fixed it for this scenario or I'm not getting something?

Probably an icon next to the filenames (for those to be compiled), once clicked, the buffer becomes a readonly one showing the compiled source.

Any plans on making the plunks show up in google? I personally have never seen a plunk come up in any search results.

I would be willing to help with this if so. I feel it would be a worthwhile experience.

Hi,

Downloading a .zip of a Plunk from the site always seems to result in a file named Unknown when downloading with Safari.

Chrome Version 36.0.1985.125

This seems to be causing issues with the main page contents loading and also prevents me from viewing plunks other people have shared.

See screenshot for error:

The "preview in separate window" works great for testing code on a mobile device. It would be awesome to have a QR code I could easily scan on the screen to quickly open that window on the phone.

Hi, when trying to use plunker on my Samsung smartphone, I can type into the editor just fine but the backspace/ delete key doesn't erase a character like it should. I've tried downloading some different keyboard apps for my device just to make sure it wasn't my device, but the problem persists.

Thanks for your wonderful web development environment. I use it all the time on desktop and hopefully all the time with my phone if this issue can be resolved.

Thanks!

Hi,

When opening the embedded version of my plunk, it reflects a very old version of my javascript code and project. How do I get the embedded version to load the current version? Am I missing something or is this a bug?

Thanks! :)

Hey, how about integrating jsDelivr.com to Plunker too?
It hosts even more files and could be useful as a good alternative.

Thanks

I'm using plunker as my main tool for prototyping.

While creating tiny modules my workflow is the following:

1. Create a plunk with a tiny module and an usage example
2. When ready, create a repo with the module at github
3. Add the module to plunker as an external library using rawgit urls
4. Refactor the original plunk by replacing the modules by the ones now offered by plunker external libraries

The modules I'm creating are intended to be highly decoupled just requiring some other tiny modules

In this scenario I would expect that dependencies are resolved recursively, but they aren't.

For example, having the following dependency tree:

[email protected]
    [email protected]
    [email protected]
        [email protected]
        [email protected]
            [email protected]
            [email protected]
                [email protected]
        [email protected]
            [email protected]
            [email protected]
                [email protected]
            [email protected]
                [email protected]
                [email protected]
                    [email protected]
    [email protected]
        [email protected]
    [email protected]
        [email protected]
    [email protected]
        [email protected]

I would expect by including [email protected] to obtain the following list of resources:

1. https://rawgit.com/definejs/define/master/define.js
2. https://rawgit.com/mujs/type.number/master/number.js
3. https://rawgit.com/mujs/type.arrayLike/master/arrayLike.js
4. https://rawgit.com/mujs/type.defined/master/defined.js
5. https://rawgit.com/mujs/list.each/master/each.js
6. https://rawgit.com/mujs/list.map/master/map.js
7. https://rawgit.com/mujs/fn.apply/master/apply.js
8. https://rawgit.com/mujs/fn.bind/master/bind.js
9. https://rawgit.com/mujs/fn.multiplex/master/multiplex.js
10. https://rawgit.com/domojs/domo/master/domo.js

Following the rules:

• Respect dependency order (this is not really important in my scenario but it is in other)
• Resolve dependencies recursively
• Remove duplicates (name@semver)

The result however is the following:

1. https://rawgit.com/definejs/define/master/define.js
2. https://rawgit.com/mujs/list.map/master/map.js
3. https://rawgit.com/mujs/fn.apply/master/apply.js
4. https://rawgit.com/mujs/fn.bind/master/bind.js
5. https://rawgit.com/mujs/fn.multiplex/master/multiplex.js
6. https://rawgit.com/domojs/domo/master/domo.js

Which are just the dependencies declared in [email protected]

See image

It is bad. I want to see clear console for testing of my project.

I'm getting

500 Error: /Users/....../plunker/plunker_www/views/landing.jade:32 30| // --> 31| > 32| != js("apps/landing") 33| script 34| var _gaq = _gaq || []; 35| _gaq.push(['_setAccount', 'UA-28928507-1']); File not found: 'vendor/angularytics/angularytics'

When trying to load www for the first time.

Moving the file plunker_www/assets/vendor/angularytics.js into the angularytics subdirectory (which exists but is empty in the repo) solves the issue.

Any way to sign in with GitHub without authorizing access to secret gists?