fix: return createBlock instances from block transforms and fix filter CSS selectors

Two related bug fixes:

- Transforms: `type: 'block'` callbacks must return a block instance created by createBlock; the previous code returned raw attribute objects which WordPress silently ignored, so the toolbar block-switcher transforms never fired. Update tests to assert on `result.name` and `result.attributes`. Add a manual jest mock for @wordpress/blocks since the package is provided at runtime via dependency-extraction-webpack-plugin.

- Filter CSS: the SCSS used a descendant combinator (`.wp-block-ksolo-image-filter .has-filter-warm img`) but the JSX puts both classes on the same element, so the filter rule never matched and picking a filter had no visual effect on the editor or the front end. Target the inner <img> by its stable class pair (`.ksolo-image-filter-img.has-filter-<slug>`) instead. Add a regression test that reads the compiled CSS and asserts the selectors are present for every preset.
This commit is contained in:
Keith Solomon
2026-08-06 15:19:50 -05:00
parent e55a747adc
commit 860a192aff
4 changed files with 116 additions and 19 deletions
+10 -3
View File
@@ -5,9 +5,14 @@
* - "From" core Image: copies image attributes, sets filter="normal",
* intensity=100.
*
* Per the Block Transforms API, `type: 'block'` transforms must return a
* block instance produced by `createBlock` from `@wordpress/blocks` — a
* raw attribute object is silently ignored and the transform fails.
*
* @package SoloFiltersImageEnhancements
*/
import { createBlock } from '@wordpress/blocks';
import { DEFAULT_PRESET } from './presets';
const IMAGE_ATTR_MAP = {
@@ -69,16 +74,18 @@ export const transforms = {
{
type: 'block',
blocks: [ 'core/image' ],
transform: ( attributes ) => toImageAttrs( attributes ),
transform: ( attributes ) =>
createBlock( 'core/image', toImageAttrs( attributes ) ),
},
],
from: [
{
type: 'block',
blocks: [ 'core/image' ],
transform: ( attributes ) => fromImageAttrs( attributes ),
transform: ( attributes ) =>
createBlock( 'ksolo/image-filter', fromImageAttrs( attributes ) ),
},
],
};
export default transforms;
export default transforms;