Skip to content

Fix: Media Library Grid view displays attachments in the wrong order when order query var is not normalized #10680

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
TrivediKavit wants to merge 2 commits into
base: trunk
Choose a base branch
from
+11 −7
Open

Fix: Media Library Grid view displays attachments in the wrong order when order query var is not normalized #10680

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0cd1931
Media: Normalize order prop in Attachments.initialize()
TrivediKavit Jan 5, 2026
78a9ebe
Media: Remove duplicate order normalization from Query model
TrivediKavit Jan 5, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 11 additions & 1 deletion src/js/media/models/attachments.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,17 @@ var Attachments = Backbone.Collection.extend(/** @lends wp.media.model.Attachmen
this.props.on( 'change:orderby', this._changeOrderby, this );
this.props.on( 'change:query', this._changeQuery, this );

this.props.set( _.defaults( options.props || {} ) );
options.props = _.defaults( options.props || {} );

// Normalize the order if it exists.
if ( 'string' === typeof options.props.order ) {
options.props.order = options.props.order.toUpperCase();
if ( 'ASC' !== options.props.order && 'DESC' !== options.props.order ) {
options.props.order = 'DESC';
Copy link
Member

@adamsilverstein adamsilverstein Jan 5, 2026 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can this use options.props.order = defaults.order.toUpperCase(); like the original code in query.js that you remove below?

Copy link
Author

@TrivediKavit TrivediKavit Jan 6, 2026 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@adamsilverstein

We cannot normalize order directly on defaults (e.g., defaults.order.toUpperCase()) in the Attachments model, as defaults refers to Query.defaultProps, which is scoped to the Query class and unavailable in the base Attachments class.

References:

Attempting defaults.order.toUpperCase() in Attachments.initialize() would fail, as defaults is undefined in that scope.

Behavior in Attachments Instances

Attachments is the base Backbone collection for media attachments. On instantiation (e.g., new wp.media.model.Attachments(models, options)), initialize:

  • Sets up this.props with options.props.
  • If options.props.order is a string, normalizes it: uppercases and defaults to 'DESC' if invalid.
  • Ensures consistent order for sorting/filtering, handling case and invalid inputs.

Previously, without normalization in Attachments.initialize(), plain Attachments instances (non-Query subclasses) could use unnormalized order (e.g., 'desc' or 'pizza'), causing inconsistent media library grid sorting.

Impact on Query Instances

Query inherits from Attachments, so normalization is inherited.

  • Before: Normalization in Query.get() ensured valid order for Query instances.
  • After: Normalization in Attachments.initialize() during instantiation (via inheritance). Query.get() applies defaults first, then new Query() triggers normalization.
  • No change in Query behavior; the fix prevents bugs in other Attachments subclasses or direct usage.

}
}

this.props.set( options.props );

if ( options.observe ) {
this.observe( options.observe );
Expand Down
6 changes: 0 additions & 6 deletions src/js/media/models/query.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -251,12 +251,6 @@ Query = Attachments.extend(/** @lends wp.media.model.Query.prototype */{
// Fill default args.
_.defaults( props, defaults );

// Normalize the order.
props.order = props.order.toUpperCase();
if ( 'DESC' !== props.order && 'ASC' !== props.order ) {
props.order = defaults.order.toUpperCase();
}

// Ensure we have a valid orderby value.
if ( ! _.contains( orderby.allowed, props.orderby ) ) {
props.orderby = defaults.orderby;
Expand Down
Loading