[faisalahammad]

Summary

Google Fonts do not load in the block editor since Kadence Blocks 3.7.3. Version 1.1.10 fixed KadenceWebfontLoader, but the WebfontLoader export still points to the old simple-web-font-loader, which builds URLs that Google rejects. This points WebfontLoader to the fixed loader too.

Fixes stellarwp/kadence-blocks#1455 (for the blocks that use WebfontLoader)

Changes

src/index.js

Before:

export { default as WebfontLoader } from './simple-web-font-loader';

After:

export { default as WebfontLoader } from './simple-webfont-loader';

Why: Countdown, Form, Testimonials, Tabs, Info Box, Progress Bar, Count Up and Advanced Gallery use WebfontLoader. With this they get the fixed loader, with no change on the blocks side. The fixed loader already reads the legacy config prop these blocks pass.

src/simple-web-font-loader/index.js (removed)

const url = `https://fonts.googleapis.com/css2?family=${encodeURIComponent(
	family.replace(/ /g, '+')
)}&display=swap`;

Why: Blocks pass Open Sans:700italic. This becomes family=Open%2BSans%3A700italic, which returns 400. It also skipped the load on first mount. Nothing uses this folder after the export change.

src/simple-webfont-loader/__tests__/index.test.js

One new test: a multi-word family with a variant from a legacy config (Open Sans:700italic) loads family=Open+Sans:ital,wght@1,700. This is the shape WebfontLoader callers send.

Testing

Test 1: Unit tests

1. npm install && npm test
   Result: the 2 webfont loader suites pass, including the new test.

Test 2: Block editor (Kadence Blocks with this branch)

1. Add a Countdown, set the number font to Playfair Display 700 italic.
2. Reload the editor without clicking any block.
   Result: the font renders in the editor. The request to fonts.googleapis.com/css2 returns 200.

Note: anything importing @kadence/components/src/simple-web-font-loader directly will break, since that folder is removed. I did not find such imports in Kadence Blocks.

[coderabbitai]

Important

• 🔍 Trigger review

This repository does not receive automatic reviews because it has fewer than 10 stars.

⚙️ Run configuration

• Configuration used: defaults
• Review profile: CHILL
• Plan: Advanced
• Run ID: 71eccd82-8a79-4a4a-a8cd-19c84b820c90

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

_{Comment @coderabbitai help to get the list of available commands.}