Skip to main content
GoodFirstPicks
DashboardIssuesReposLeaderboard

GoodFirstPicks by Leaveitblank © 2026

CreatorRequest a RepoPrivacy PolicyTerms of Service
Block Fields: Cover block issues | GoodFirstPicks

Block Fields: Cover block issues

WordPress/gutenberg 9 comments 1mo ago
View on GitHub
mediumopenScope: somewhat clearSkill match: maybeWordPressJavaScriptReact

Why this is a good first issue

The issue involves fixing property mapping and moving logic into useEffect, but overlaps with ongoing work.

AI Summary

The issue involves two problems with the cover block: incorrect `backgroundType` property mapping and incorrect overlay opacity/text color settings when adding new images. The fixes require modifying property mapping and moving logic into `useEffect`, but there is potential overlap with ongoing work by another contributor.

Issue Description

This tracks some issues with the cover block related to the 'Block Fields' experiment.

A prerequisite for testing is to enable the 'Block Fields' experiment on the Gutenberg experiment page.

1. backgroundType not set correctly

After #74575, there's a small issue with the cover block. The backgroundType property is not set correctly when adding a video using the media field in the inspector.

I believe this line is the problem: https://github.com/WordPress/gutenberg/blob/b06f167d4ecf1b38d22da21f58d5d0911fd56c3c/packages/block-library/src/cover/index.js#L88

It should read:

backgroundType: value.mediaType, 

It's probably worth rolling this fix into other cover block fixes.

2. Overlay opacity and text color (isDark) are not set correctly when adding new images

Steps to reproduce:

  1. Add a cover block
  2. From the inspector content tab, upload an image
  3. Note that the image uploads isn't visible in the block. In the style tab the block still has 100 opacity

Cause: I think that the issue is that the block has some internal logic for calculating the dimRatio and isDark - https://github.com/WordPress/gutenberg/blob/b06f167d4ecf1b38d22da21f58d5d0911fd56c3c/packages/block-library/src/cover/edit/index.js#L194-L261

This code executes whenever uploading new images from the block, but not if some external code (like the Block Fields) tries to set a new image. A fix might be to move the code into a useEffect.

GitHub Labels

[Type] Bug[Status] In Progress[Block] Cover

Want to work on this?

Claim this issue to let others know you're working on it. You'll earn 20 points when you complete it!

Risk Flags

  • potential overlap with ongoing work
  • requires understanding of Block Fields experiment
Loading labels...

Details

Points20 pts
Difficultymedium
Scopesomewhat clear
Skill Matchmaybe
Test Focusedno
Assigneeockham