Block Gap for the inserter is getting ignored on last elements

[hanneslsm]

Description

When I am having a column block and some groups within, I'd like to move the groups around. The column has a block gap, which isn't displayed on the last element when drag & dropping the groups. The inserter should have a padding (= half the block gap).

Step-by-step reproduction instructions

1. Drag & Drop a block element in a area where a block gap is defined.
2. Drag & Drop the block to the last element. Watch the block gap.

Screenshots, screen recording, code snippet

Screen.Recording.2023-10-18.at.08.12.20.mp4

Environment info

• WP 6.3.2
• GB 16.8.1
• Custom theme

Please confirm that you have searched existing issues in the repo.

No

Please confirm that you have tested with all plugins deactivated except Gutenberg.

No

[jordesign]

Confirmed this in testing with WP 6.3.2 and TT3

[ramonjd]

Just to confirm, is the expectation that the inbetween inserter line will reflect the block gap value that will take effect after dropping?

If so, it's a tricky one. The inbetween inserter popup is rendered above the block list (under .edit-post-visual-editor) so it's not really context aware.

I had a quick look to see if we could apply some bottom margin to the last-child of a container that has block gap applied when the inserter is being dragged, but couldn't get it to work.

The inbetween inserter has been explicitly given a zero margin:

gutenberg/packages/block-editor/src/components/block-popover/style.scss

Line 7 in f1e4c2a

margin: 0 !important;

So the idea is that, if a block container with layout knows that the block inserter is positioned after the last-child we add the relevant blockGap value to the inserter's margin.

But in practice it's not straight forward.

[hanneslsm]

Just to confirm, is the expectation that the inbetween inserter line will reflect the block gap value that will take effect after dropping?

Not sure if I got this.
Let me rephrase to avoid misunderstandings: The expectation is that via the inserter (blue line) represents already if there is a block gap or not. This works perfectly fine in between elements. But when dropping it below the last element, the inserter tells me that there won't be a gap… but after dropping it "suddenly appears".

I see how this is becoming tricky, especially when considering horizontal blocks.
However, I think that the is inserter is in its core a "preview" on where the blocks can be dropped, so we should aim for the best preview possible.

[ramonjd]

The expectation is that via the inserter (blue line) represents already if there is a block gap or not.

Thanks for the clarification. It's what I understood, but I phrased it poorly, sorry! 👍🏻

I agree with your sentiments in relation to getting the preview state right while dragging, I'm just not sure about the best way to reflect this yet. 🤔