WordPress.org

Make WordPress Core

Opened 2 years ago

Closed 4 weeks ago

Last modified 4 weeks ago

#44745 closed defect (bug) (fixed)

REST API: incorrect slashes in url if parent empty

Reported by: nicomollet Owned by: adamsilverstein
Milestone: 5.6 Priority: normal
Severity: normal Version: 4.9.8
Component: REST API Keywords: has-patch reporter-feedback commit
Focuses: javascript Cc:

Description

Hello everyone,

I am using the WP.API with a custom versionString: "wc/v2/" from WooCommerce.

When fetching ProductCategories (or any other collections with two capital letters), the url called is:
http://websiteurl/wp-json/wc/v2/products//categories

Example of the code I use, to be able to reproduce the error:

  wp.api.init({'versionString': 'wc/v2/'});
  var productcategories = new wp.api.collections.ProductsCategories();
  productcategories.fetch().done( function() {
    productcategories.each( function( productcategory ) {
      console.log( productcategory.attributes );
    } );
  } );

My tentative fix is the following:

In wp-api.js, line 1406
The parent is sometimes empty, leading to two consecutive slashes.

// Function that returns a constructed url passed on the parent.
url: function() {
  return routeModel.get( 'apiRoot' ) + routeModel.get( 'versionString' ) +
      parentName + '/' + this.parent + '/' +
      routeName;
},

should be replaced by:

// Function that returns a constructed url passed on the parent.
url: function() {
  return routeModel.get( 'apiRoot' ) + routeModel.get( 'versionString' ) +
    parentName + '/' +
    ( ( _.isUndefined( this.get( 'parent' ) ) || 0 === this.get( 'parent' ) ) ?
      ( _.isUndefined( this.get( 'parent_post' ) ) ? '' : this.get( 'parent_post' ) + '/' ) :
      this.get( 'parent' ) + '/' ) +
    routeName;
},

Thank you very much
Nicolas

Attachments (3)

44745.diff (807 bytes) - added by adamsilverstein 5 weeks ago.
before.png (38.2 KB) - added by adamsilverstein 5 weeks ago.
after.png (68.5 KB) - added by adamsilverstein 5 weeks ago.

Download all attachments as: .zip

Change History (15)

This ticket was mentioned in Slack in #core-restapi by timothybjacobs. View the logs.


18 months ago

#2 @TimothyBlynJacobs
5 weeks ago

  • Focuses javascript added

@adamsilverstein Do you have the bandwidth to take a look at this?

#3 @adamsilverstein
5 weeks ago

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

@adamsilverstein Do you have the bandwidth to take a look at this?

Sure, I can try.

@nicomollet Thank you for reporting this issue. Your code change makes sense if this.parent can be empty during collection route construction, which apparently it can!

I have a follow up question:

The parent is sometimes empty, leading to two consecutive slashes.

Do you have a code sample for the endpoint (or steps to reproduce this)? I do see where we use a similar (hard to read) trinary above when using `this.parent` in the model route construction. Just curious how to recreate with a collection.

Have you tested the fix above you proposed and verified it works as expected for your endpoints?

Last edited 5 weeks ago by adamsilverstein (previous) (diff)

#4 @adamsilverstein
5 weeks ago

I was able to reproduce this by setting up woo-commerce and adding some multilevel product categories with two letter names as you mentioned. I created a slightly modified fix from your code that corrected the issue in my testing. patch incoming.

This ticket was mentioned in PR #658 on WordPress/wordpress-develop by adamsilverstein.


5 weeks ago

  • Keywords has-patch added; needs-patch removed

#6 @adamsilverstein
5 weeks ago

@nicomollet can you please confirm that 44745.diff fixes the issue you were seeing?

#7 @adamsilverstein
5 weeks ago

Testing instructions:

  • Install woocommerce plugin.
  • Create some categories, with parents, use short category names like "AA" and "BB" going several levels deep.
  • Enqueue wp-api script, in your themes functions.php add
add_action( 'admin_enqueue_scripts', function() {
        wp_enqueue_script( 'wp-api' );
} );
  • Load any admin page and in the console enter:
    wp.api.init({'versionString': 'wc/v2/'});
    var productcategories = new wp.api.collections.ProductsCategories();
    productcategories.fetch().done( function() {
      productcategories.each( function( productcategory ) {
        console.log( productcategory.attributes );
      } );
    } );
    

Result before patch: JS error. Result after patch: list of categories.

@adamsilverstein
5 weeks ago

#8 @adamsilverstein
5 weeks ago

  • Keywords reporter-feedback commit added

#9 @nicomollet
5 weeks ago

Hello everyone,

Sorry I am late, I am here to confirm I tested the code myself.

The example I provided with ProductCategories in WooCommerce, is also an issue with the core "PageRevisions" collection: two slashes.

@adamsilverstein you reproduced and documented exactly what happened, thank you.

The patch obviously works great ;)

Last edited 5 weeks ago by nicomollet (previous) (diff)

#10 @adamsilverstein
4 weeks ago

  • Milestone changed from Awaiting Review to 5.6

#11 @adamsilverstein
4 weeks ago

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

In 49390:

REST API: JS Client - improve collection route construction for empty parents.

Fix an issue where the constructed path for hierarchical collections could contain a double slash ("") when items contained empty parents, causing an error.

Props nicomollet.
Fixes #44745.

Note: See TracTickets for help on using tickets.