Skip to content

Product Images are using full res image and not the processed versions #3637

@nnnnat

Description

@nnnnat

When I was working on this PR I started to notice the full resolution product image was being used in almost every instance. I thought it was only in my branch but I've tested it on master and have seen it every time. Can someone test and confirm I'm not crazy?

Expected behavior

  • Product images should be referencing the appropriate image crop in the src attribute.
  • For example, product images on the invoice page should be using the thumbnail crop
  • The image src path should look something like this /assets/files/Media/Z5v7ARFEjWKdoSymL/shoe.jpg?token=eyJhdXRoVG9rZW4iOiJwVnVKS2J5WVRjcG1yOG03QU4ybk15ZkFPb2VXUzJjaGh6Y0VERHZwckxvIn0%3D&store=thumbnail

Actual behavior

  • Product images are only referencing the full resolution uploaded image
  • Product image src path looks like this /assets/files/Media/Z5v7ARFEjWKdoSymL/shoe.jpg?token=eyJhdXRoVG9rZW4iOiJwVnVKS2J5WVRjcG1yOG03QU4ybk15ZkFPb2VXUzJjaGh6Y0VERHZwckxvIn0%3D without the &store={size}

Steps to reproduce the behavior

  • Run reaction reset to get a fresh reaction store.
  • Login as admin and upload new product images to the sample product
  • Upload images to each product variant
  • Check the src and image info of the new product images to see it's referencing the original uploaded image and not the cropped version
  • In another browser purchase both product variants as a guest
  • On the invoice page, inspect the product thumbnails to see it referencing the full image and not the thumbnail version

screenshots
product-detail
example of small image referencing the og image


product-varient

product variant images referencing the og image and not the small square version

invoice-thumbnails

product thumbnail on the invoice/receipt page using the og image and not the thumbnail version

Notes

Possible Cause
I did some poking around the code base and I think the issue might be coming from these React Components (media.js & mediaGallery.js) I'm still pretty new to RC so I might be totally wrong about this.

Possible related issue
#3399

Images I used
bike
shoe

Versions

Node: 9.4.0
NPM: 5.6.0
Meteor Node: 8.9.3
Meteor NPM: 5.5.1
Reaction CLI: 0.26.4
Reaction: 1.7.0
Reaction branch: master

Metadata

Metadata

Assignees

Labels

bugFor issues that describe a defect or regression in the released software

Type

No type

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions