FIX: show lightbox for small images (#29140)

We want to allow lightboxing of smaller images, even if they are below the minimum size for image thumbnail generation.

This change sets a minimum threshold of 100 x 100 pixels for triggering the lightbox.

---------

Co-authored-by: Régis Hanol <regis@hanol.fr>
This commit is contained in:
David Battersby 2024-10-18 09:45:08 +04:00 committed by GitHub
parent 11017b20f8
commit 48308a5ee6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 57 additions and 17 deletions

View File

@ -8,6 +8,8 @@ class CookedPostProcessor
LIGHTBOX_WRAPPER_CSS_CLASS = "lightbox-wrapper" LIGHTBOX_WRAPPER_CSS_CLASS = "lightbox-wrapper"
GIF_SOURCES_REGEXP = %r{(giphy|tenor)\.com/} GIF_SOURCES_REGEXP = %r{(giphy|tenor)\.com/}
MIN_LIGHTBOX_WIDTH = 100
MIN_LIGHTBOX_HEIGHT = 100
attr_reader :cooking_options, :doc attr_reader :cooking_options, :doc
@ -181,10 +183,8 @@ class CookedPostProcessor
img.add_class("animated") img.add_class("animated")
end end
if original_width <= SiteSetting.max_image_width && generate_thumbnail =
original_height <= SiteSetting.max_image_height original_width > SiteSetting.max_image_width || original_height > SiteSetting.max_image_height
return
end
user_width, user_height = [original_width, original_height] if user_width.to_i <= 0 && user_width, user_height = [original_width, original_height] if user_width.to_i <= 0 &&
user_height.to_i <= 0 user_height.to_i <= 0
@ -201,6 +201,7 @@ class CookedPostProcessor
end end
if upload.present? if upload.present?
if generate_thumbnail
upload.create_thumbnail!(width, height, crop: crop) upload.create_thumbnail!(width, height, crop: crop)
each_responsive_ratio do |ratio| each_responsive_ratio do |ratio|
@ -211,14 +212,15 @@ class CookedPostProcessor
upload.create_thumbnail!(resized_w, resized_h, crop: crop) upload.create_thumbnail!(resized_w, resized_h, crop: crop)
end end
end end
end
return if upload.animated? return if upload.animated?
if img.ancestors(".onebox, .onebox-body").blank? && !img.classes.include?("onebox") if img.ancestors(".onebox, .onebox-body").blank? && !img.classes.include?("onebox")
add_lightbox!(img, original_width, original_height, upload, cropped: crop) add_lightbox!(img, original_width, original_height, upload)
end end
optimize_image!(img, upload, cropped: crop) optimize_image!(img, upload, cropped: crop) if generate_thumbnail
end end
end end
@ -265,15 +267,18 @@ class CookedPostProcessor
end end
end end
def add_lightbox!(img, original_width, original_height, upload, cropped: false) def add_lightbox!(img, original_width, original_height, upload)
return if original_width < MIN_LIGHTBOX_WIDTH || original_height < MIN_LIGHTBOX_HEIGHT
# first, create a div to hold our lightbox # first, create a div to hold our lightbox
lightbox = create_node("div", LIGHTBOX_WRAPPER_CSS_CLASS) lightbox = create_node("div", LIGHTBOX_WRAPPER_CSS_CLASS)
img.add_next_sibling(lightbox) img.add_next_sibling(lightbox)
lightbox.add_child(img) lightbox.add_child(img)
# then, the link to our larger image # then, the link to our larger image
src_url = Upload.secure_uploads_url?(img["src"]) ? upload&.url : img["src"] src_url = Upload.secure_uploads_url?(img["src"]) ? upload&.url || img["src"] : img["src"]
src = UrlHelper.cook_url(src_url || img["src"], secure: @should_secure_uploads) src = UrlHelper.cook_url(src_url, secure: @should_secure_uploads)
a = create_link_node("lightbox", src) a = create_link_node("lightbox", src)
img.add_next_sibling(a) img.add_next_sibling(a)

View File

@ -401,6 +401,40 @@ RSpec.describe CookedPostProcessor do
end end
end end
context "with small images" do
fab!(:upload) { Fabricate(:image_upload, width: 150, height: 150) }
fab!(:post) { Fabricate(:post, user: user_with_auto_groups, raw: <<~HTML) }
<img src="#{upload.url}">
HTML
let(:cpp) { CookedPostProcessor.new(post, disable_dominant_color: true) }
before { SiteSetting.create_thumbnails = true }
it "shows the lightbox when both dimensions are above the minimum" do
cpp.post_process
expect(cpp.html).to match(/<div class="lightbox-wrapper">/)
end
it "does not show lightbox when both dimensions are below the minimum" do
upload.update!(width: 50, height: 50)
cpp.post_process
expect(cpp.html).not_to match(/<div class="lightbox-wrapper">/)
end
it "does not show lightbox when either dimension is below the minimum" do
upload.update!(width: 50, height: 150)
cpp.post_process
expect(cpp.html).not_to match(/<div class="lightbox-wrapper">/)
end
it "does not create thumbnails for small images" do
Upload.any_instance.expects(:create_thumbnail!).never
cpp.post_process
end
end
context "with large images" do context "with large images" do
fab!(:upload) { Fabricate(:image_upload, width: 1750, height: 2000) } fab!(:upload) { Fabricate(:image_upload, width: 1750, height: 2000) }

View File

@ -636,7 +636,7 @@ RSpec.describe Email::Sender do
@secure_image_2 = @secure_image_2 =
UploadCreator.new( UploadCreator.new(
file_from_fixtures("logo-dev.png", "images"), file_from_fixtures("logo-dev.png", "images"),
"secuere_logo_2.png", "secure_logo_2.png",
).create_for(Discourse.system_user.id) ).create_for(Discourse.system_user.id)
@secure_image_2.update_secure_status(override: true) @secure_image_2.update_secure_status(override: true)
@secure_image_2.update(access_control_post_id: reply.id) @secure_image_2.update(access_control_post_id: reply.id)
@ -666,7 +666,7 @@ RSpec.describe Email::Sender do
@secure_image_2 = @secure_image_2 =
UploadCreator.new( UploadCreator.new(
file_from_fixtures("logo-dev.png", "images"), file_from_fixtures("logo.png", "images"),
"something-cool.png", "something-cool.png",
).create_for(Discourse.system_user.id) ).create_for(Discourse.system_user.id)
@secure_image_2.update_secure_status(override: true) @secure_image_2.update_secure_status(override: true)
@ -701,6 +701,7 @@ RSpec.describe Email::Sender do
expect(summary.attachments.map(&:filename)).to include( expect(summary.attachments.map(&:filename)).to include(
*[@secure_image, @secure_image_2, @secure_image_3].map(&:original_filename), *[@secure_image, @secure_image_2, @secure_image_3].map(&:original_filename),
) )
expect(summary.attachments.size).to eq(3)
expect(summary.to_s.scan("Content-Type: text/html;").length).to eq(1) expect(summary.to_s.scan("Content-Type: text/html;").length).to eq(1)
expect(summary.to_s.scan("Content-Type: text/plain;").length).to eq(1) expect(summary.to_s.scan("Content-Type: text/plain;").length).to eq(1)
expect(summary.to_s.scan(/cid:[\w\-@.]+/).length).to eq(3) expect(summary.to_s.scan(/cid:[\w\-@.]+/).length).to eq(3)