Beta Media button fails on frontend

[anonymized_96400]

Basically, if you add wp_editor() somewhere on the frontend and then hit the new beta media button you get a JS error (TypeError: e is undefined) in underscore.min.js.

Tested this with the latest trunk on TwentyTwelve with no active plugins.

[bpetty]

Using this inside the Twenty Twelve theme...

wp_editor('Test content', 'frontend_editor');

There's certainly something wrong here as I also get JS errors:

Uncaught TypeError: Cannot call method 'replace' of undefined     underscore.min.js:5
T.template                                                        underscore.min.js:5
_.extend.template                                                 media-models.js:63
media.view.AttachmentDisplaySettings.Backbone.View.extend.render  media-views.js:1174
media.view.Workspace.Library.media.view.Workspace.extend.initToolbarView media-views.js:769
media.view.Workspace.Library.media.view.Workspace.extend.initialize media-views.js:731
g.View                                                            backbone.min.js:33
d                                                                 backbone.min.js:38
d                                                                 backbone.min.js:38
media.controller.Workflow.Backbone.Model.extend.view              media-views.js:88
media.controller.Workflow.Backbone.Model.extend.render            media-views.js:115
wp.media                                                          media-models.js:18
wp.mce.media.add                                                  media-upload.js:105
wp.mce.media.init                                                 media-upload.js:164
p.event.dispatch                                                  jquery.js:2
p.event.add.g.handle.h                                            jquery.js:2

[nacin]

This was 3 weeks ago. Is this still reproducible?

[koopersmith]

In 22699:

Media: Improve media buttons on the front end.

• Use a less specific selector (the body, actually) to delegate opening the media dialog.
• Allow the editor ID to be the empty string so the media_buttons action can be called without arguments.

see #22284, #21390.

[koopersmith]

Using media on the frontend with wp_editor() currently does not cause any errors. That said, we could use a few bits of CSS to lock the styles in place.

Enqueuing anything that depends on wp-plupload (such as media-upload) without calling wp_plupload_default_settings() first will cause any dependent script to break, as wp.Uploader bails without its settings. The best way to fix this at the moment is probably to inspect whether the wp-plupload script is enqueued at the standard script printing points, and if so, generate its settings first.

[koopersmith]

In 22776:

Media: Make media views dependent on jQuery UI sortable. see #22284, #21390.

[lessbloat]

Couple more base styles in 22284.diff.

[koopersmith]

In 22779:

Media: Use a more specific class for toolbar buttons. see #22284, #21390.

[koopersmith]

In 22780:

Media: Add base form element CSS. props lessbloat. see #22284, #21390.

[lessbloat]

A few more minor CSS tweaks in 22284.2.diff​.

[lessbloat]

22284.3.diff​ adds default link colors & removes need for !important.

[koopersmith]

In 22782:

Media: Normalize font sizes, link colors, and other styles. props lessbloat, see #22284, #21390.

[koopersmith]

Closing this as fixed. If there are any additional display issues on the front-end, please open a new ticket.