Automattic / Automattic/jetpack

Tiled gallery: Gallery transform produces wrong layout

Open
#11,780 0 comments 0 reactions 0 assignees View on GitHub
[Block] Tiled Gallery [Feature] Tiled Gallery [Focus] Blocks [Pri] Low Bug
Dominant language
PHP
Stars
1.8k
Forks
898
Avg merge
1d 18h
Merged PRs (30d)
774

Description

When transforming the core Gallery block to a Tiled Gallery, the layout is different from when the same Tiled Gallery is created directly.

## To reproduce

1. Create a _Gallery_ block with at least 3 images.
1. Create a _Tiled Gallery_ block with the same images.
1. Transform the _Gallery_ to a _Tiled Gallery_. Depending on the image ratios, the transformed block may be different from the new block.

Note that any action with causes the images to be re-rendered will fix the layout, like selecting an image in the block.

## Screens

Here are screenshots of two galleries, above is transformed from core _Gallery_ block, below is a directly created _Tiled Gallery_ block. They should be identical after transform, but are different.

### Frontend

![screen shot 2019-02-04 at 17 57 51](https://user-images.githubusercontent.com/841763/52223668-6a067100-28a6-11e9-9143-ec018a198022.png)

### Editor

![screen shot 2019-02-04 at 17 57 08](https://user-images.githubusercontent.com/841763/52223669-6a067100-28a6-11e9-9dfa-ed01c3f587a1.png)

Spotted while debugging https://github.com/Automattic/jetpack/issues/11150

cc: @simison

Contributor guide

Open the contributing guide

Research direction

Start in the block editor by reproducing the Gallery-to-Tiled Gallery transform with at least three images and compare it with a directly created Tiled Gallery using the same images. The issue names no implementation files or tests; done means both layouts are identical immediately after transformation, without requiring a later image rerender.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.