Make WordPress Core

Opened 9 years ago

Closed 8 years ago

#32783 closed defect (bug) (fixed)

Ajax issue in the customizer when previewing a different theme

Reported by: fab1en's profile Fab1en Owned by: westonruter's profile westonruter
Milestone: 4.5 Priority: normal
Severity: normal Version: 4.1
Component: Customize Keywords:
Focuses: javascript, administration Cc:


When a theme is activated, and another one is previewed using the customizer live preview, ajax requests are run against the old theme, not the one being previewed.

The easiest way to see this issue is to use the Header Image cropping function included in core.

  1. Install and activate a theme that has no custom-header feature (for example Modern Estate)
  2. Go to the customizer, click on the change button to choose a new theme (for example, TwentyFifteen
  3. Use the Header Image panel to select and crop an image
  4. You get the following error : There has been an error cropping your image.
  5. Activate TwentyFifteen and crop the same image again : error has disappeared

If a theme defines specific ajax actions, those actions will not be available in the live preview until the theme is really activated.

Attachments (3)

32783.diff (687 bytes) - added by rittesh.patel 8 years ago.
Patch to fix #32783
32783.2.diff (1.5 KB) - added by faishal 8 years ago.
Without ajaxprefilter approach, by allowing crop ajax data to be overridden
32783.3.diff (1.6 KB) - added by westonruter 8 years ago.
Minor style tweaks

Download all attachments as: .zip

Change History (15)

#1 @celloexpressions
9 years ago

  • Keywords needs-patch added

Probably should add the theme previewing logic to ajax calls, although I thought it already was. Needs investigating.

This ticket was mentioned in Slack in #core-customize by fab1en. View the logs.

9 years ago

#3 @westonruter
9 years ago

  • Milestone changed from Awaiting Review to 4.5

Need to make sure the theme parameter is included in the Ajax requests.

#4 @westonruter
9 years ago

Note that generally in Core, Ajax requests initiated from the preview do not get the Customizer state applied. This has, however, been implemented in the transactions patch via jQuery.prefilter() to inject the Customizer transaction UUID. So this issue will be resolved there.

However, this issue is specific to an Ajax request created in the Customizer pane, and so I think it is included in the scope of transactions.

8 years ago

Patch to fix #32783

8 years ago

Without ajaxprefilter approach, by allowing crop ajax data to be overridden

#5 @westonruter
8 years ago

  • Keywords has-patch added; needs-patch removed

I like that approach, to hook into the underlying doCrop function, and extending an exposed doCropArgs to inject the additional args.

#6 @westonruter
8 years ago

  • Keywords dev-feedback added

@wonderboymusic thoughts on extending the in this way?

This ticket was mentioned in Slack in #core by westonruter. View the logs.

8 years ago

#8 @kirasong
8 years ago

  • Owner set to westonruter
  • Status changed from new to assigned

8 years ago

Minor style tweaks

#9 @westonruter
8 years ago

  • Keywords dev-feedback removed

#10 @westonruter
8 years ago

  • Resolution set to fixed
  • Status changed from assigned to closed

In 36866:

Customize: Fix image cropping when doing live preview of theme switches.

Ensure that the Customizer gets bootstrapped with the pre-activated theme supplied in the custom-header-crop admin ajax requests.

Props faishal, rittesh.patel.
Fixes #32783.

#11 @pento
8 years ago

  • Keywords has-patch removed
  • Resolution fixed deleted
  • Status changed from closed to reopened

[36866] updated media-views.js, but didn't apply the change to controllers/cropper.js, which is causing grunt precommit:js to incorrectly remove the change from media-views.js.

#12 @pento
8 years ago

  • Resolution set to fixed
  • Status changed from reopened to closed

In 36931:

Customize: Update cropper.js to match changes in [36866].

media-views.js was updated, but the changes weren't added to cropper.js, which caused the grunt precommit:js job to incorrectly remove the changes from media-views.js.

Fixes #32783.

Note: See TracTickets for help on using tickets.