diff --git a/packages/koenig-lexical/src/nodes/CallToActionNodeComponent.jsx b/packages/koenig-lexical/src/nodes/CallToActionNodeComponent.jsx index 4b315bc8b..a1669e688 100644 --- a/packages/koenig-lexical/src/nodes/CallToActionNodeComponent.jsx +++ b/packages/koenig-lexical/src/nodes/CallToActionNodeComponent.jsx @@ -40,6 +40,13 @@ export const CallToActionNodeComponent = ({ }); }; + const handleButtonTextChange = (event) => { + editor.update(() => { + const node = $getNodeByKey(nodeKey); + node.buttonText = event.target.value; + }); + }; + return ( <> {}} + updateButtonText={handleButtonTextChange} updateButtonUrl={() => {}} updateHasSponsorLabel={() => {}} updateLayout={() => {}} diff --git a/packages/koenig-lexical/test/e2e/cards/cta-card.test.js b/packages/koenig-lexical/test/e2e/cards/cta-card.test.js index 4d075bd53..8fd0c3f57 100644 --- a/packages/koenig-lexical/test/e2e/cards/cta-card.test.js +++ b/packages/koenig-lexical/test/e2e/cards/cta-card.test.js @@ -55,4 +55,12 @@ test.describe('Call To Action Card', async () => { expect(await page.isVisible('[data-testid="button-text"]')).toBe(false); expect(await page.isVisible('[data-testid="button-url"]')).toBe(false); }); + + test('can set button text', async function () { + await focusEditor(page); + await insertCard(page, {cardName: 'call-to-action'}); + await page.click('[data-testid="button-settings"]'); + await page.fill('[data-testid="button-text"]', 'Click me'); + expect(await page.textContent('[data-testid="cta-button"]')).toBe('Click me'); + }); });