From f0b565635e67a300f86195e9ba9d4a584142a728 Mon Sep 17 00:00:00 2001 From: dylandepass Date: Wed, 13 Dec 2023 10:49:05 -0500 Subject: [PATCH] fix: lowercase block names when copied (#93) * fix: lowercase block names when copied * fix: assume lowercase out of pipeline * fix: rename getAuthorFriendlyName to normalizeBlockName --- src/plugins/blocks/utils.js | 13 ++++++------- test/plugins/blocks/blocks.test.js | 28 ++++++++++++++-------------- test/plugins/blocks/utils.test.js | 12 ++++++------ 3 files changed, 26 insertions(+), 27 deletions(-) diff --git a/src/plugins/blocks/utils.js b/src/plugins/blocks/utils.js index a9c8e36..4e4ac00 100644 --- a/src/plugins/blocks/utils.js +++ b/src/plugins/blocks/utils.js @@ -110,9 +110,8 @@ function getPreferedForegroundColor() { .getPropertyValue('--sk-table-fg-color') || '#ffffff'; } -export function getAuthorFriendlyName(name) { - return name.replace(/-/g, ' ') - .replace(/\b\w/g, char => char.toUpperCase()); +export function normalizeBlockName(name) { + return name.replace(/-/g, ' '); } export async function convertBlockToTable(context, block, name, path) { @@ -131,7 +130,7 @@ export async function convertBlockToTable(context, block, name, path) { table.setAttribute('style', 'width:100%;'); const headerRow = document.createElement('tr'); - headerRow.append(createTag('td', { colspan: maxCols, style: `background-color: ${getPreferedBackgroundColor()}; color: ${getPreferedForegroundColor()};` }, getAuthorFriendlyName(name))); + headerRow.append(createTag('td', { colspan: maxCols, style: `background-color: ${getPreferedBackgroundColor()}; color: ${getPreferedForegroundColor()};` }, normalizeBlockName(name))); table.append(headerRow); for (const row of rows) { const columns = [...row.children]; @@ -171,7 +170,7 @@ export function convertObjectToTable(name, object) { table.setAttribute('style', 'width:100%;'); const headerRow = document.createElement('tr'); - headerRow.append(createTag('td', { colspan: 2, style: `background-color: ${getPreferedBackgroundColor()}; color: ${getPreferedForegroundColor()};` }, getAuthorFriendlyName(name))); + headerRow.append(createTag('td', { colspan: 2, style: `background-color: ${getPreferedBackgroundColor()}; color: ${getPreferedForegroundColor()};` }, normalizeBlockName(name))); table.append(headerRow); for (const [key, value] of Object.entries(object)) { @@ -355,7 +354,7 @@ async function getSectionMetadata(context, block, baseURL) { return convertBlockToTable( context, sectionMetadata, - 'Section metadata', + 'section metadata', baseURL, ); } @@ -538,7 +537,7 @@ export async function copyPageToClipboard(context, wrapper, blockURL, pageMetada } if (pageMeta) { - const pageMetadataTable = convertObjectToTable('Metadata', pageMeta); + const pageMetadataTable = convertObjectToTable('metadata', pageMeta); wrapperClone.append(pageMetadataTable); } diff --git a/test/plugins/blocks/blocks.test.js b/test/plugins/blocks/blocks.test.js index 4541184..0829a33 100644 --- a/test/plugins/blocks/blocks.test.js +++ b/test/plugins/blocks/blocks.test.js @@ -532,9 +532,9 @@ describe('Blocks Plugin', () => { expect(copiedHTML.querySelectorAll(':scope > div').length).to.eq(1); expect(copiedHTML.querySelectorAll(':scope table').length).to.eq(3); - expect(copiedHTML.querySelector('table:nth-of-type(1) tr td').textContent).to.eq('Z Pattern'); - expect(copiedHTML.querySelector('table:nth-of-type(2) tr td').textContent).to.eq('Banner (Small, Left)'); - expect(copiedHTML.querySelector('table:nth-of-type(3) tr td').textContent).to.eq('Section Metadata'); + expect(copiedHTML.querySelector('table:nth-of-type(1) tr td').textContent).to.eq('z pattern'); + expect(copiedHTML.querySelector('table:nth-of-type(2) tr td').textContent).to.eq('banner (small, left)'); + expect(copiedHTML.querySelector('table:nth-of-type(3) tr td').textContent).to.eq('section metadata'); return copiedHTML; } @@ -581,8 +581,8 @@ describe('Blocks Plugin', () => { const copiedHTML = createTag('div', undefined, clipboardHTML); expect(copiedHTML.querySelectorAll(':scope > div').length).to.eq(2); expect(copiedHTML.querySelectorAll(':scope table').length).to.eq(3); - expect(copiedHTML.querySelector('table:nth-of-type(1) tr td').textContent).to.eq('Blockquote'); - expect(copiedHTML.querySelector('table:nth-of-type(2) tr td').textContent).to.eq('Section Metadata'); + expect(copiedHTML.querySelector('table:nth-of-type(1) tr td').textContent).to.eq('blockquote'); + expect(copiedHTML.querySelector('table:nth-of-type(2) tr td').textContent).to.eq('section metadata'); // eslint-disable-next-line max-len // expect(copiedHTML.querySelector('table:nth-of-type(2) tr td').textContent).to.eq('Metadata'); @@ -591,7 +591,7 @@ describe('Blocks Plugin', () => { // There should be 3 tables as per assert above. copiedHTML.querySelectorAll(':scope table').forEach((table, index) => { if (index === 2) { - expect(table.querySelector('tr td').textContent).to.eq('Metadata'); + expect(table.querySelector('tr td').textContent).to.eq('metadata'); } }); @@ -634,7 +634,7 @@ describe('Blocks Plugin', () => { // Make sure section metadata was copied const tds = copiedHTML.querySelectorAll('td'); - const targetTd = Array.from(tds).find(td => td.textContent.trim() === 'Section Metadata'); + const targetTd = Array.from(tds).find(td => td.textContent.trim() === 'section metadata'); expect(targetTd).to.exist; return copiedHTML; @@ -685,7 +685,7 @@ describe('Blocks Plugin', () => { // Make sure section metadata was copied const tds = copiedHTML.querySelectorAll('td'); - const targetTd = Array.from(tds).find(td => td.textContent.trim() === 'Section Metadata'); + const targetTd = Array.from(tds).find(td => td.textContent.trim() === 'section metadata'); expect(targetTd).to.exist; return copiedHTML; @@ -770,9 +770,9 @@ describe('Blocks Plugin', () => { expect(copiedHTML.querySelectorAll(':scope > div').length).to.eq(1); expect(copiedHTML.querySelectorAll(':scope table').length).to.eq(3); expect(copiedHTML.querySelector(':scope h2').textContent).to.eq('Heading'); - expect(copiedHTML.querySelector('table:nth-of-type(1) tr td').textContent).to.eq('Z Pattern'); - expect(copiedHTML.querySelector('table:nth-of-type(2) tr td').textContent).to.eq('Banner (Small, Left)'); - expect(copiedHTML.querySelector('table:nth-of-type(3) tr td').textContent).to.eq('Section Metadata'); + expect(copiedHTML.querySelector('table:nth-of-type(1) tr td').textContent).to.eq('z pattern'); + expect(copiedHTML.querySelector('table:nth-of-type(2) tr td').textContent).to.eq('banner (small, left)'); + expect(copiedHTML.querySelector('table:nth-of-type(3) tr td').textContent).to.eq('section metadata'); return copiedHTML; } @@ -814,13 +814,13 @@ describe('Blocks Plugin', () => { expect(copiedHTML.querySelectorAll(':scope > div').length).to.eq(2); expect(copiedHTML.querySelectorAll(':scope table').length).to.eq(3); expect(copiedHTML.querySelector(':scope h1').textContent).to.eq('My blog post about a subject'); - expect(copiedHTML.querySelector('table:nth-of-type(1) tr td').textContent).to.eq('Blockquote'); - expect(copiedHTML.querySelector('table:nth-of-type(2) tr td').textContent).to.eq('Section Metadata'); + expect(copiedHTML.querySelector('table:nth-of-type(1) tr td').textContent).to.eq('blockquote'); + expect(copiedHTML.querySelector('table:nth-of-type(2) tr td').textContent).to.eq('section metadata'); // See above for this sillyness copiedHTML.querySelectorAll(':scope table').forEach((table, index) => { if (index === 2) { - expect(table.querySelector('tr td').textContent).to.eq('Metadata'); + expect(table.querySelector('tr td').textContent).to.eq('metadata'); } }); diff --git a/test/plugins/blocks/utils.test.js b/test/plugins/blocks/utils.test.js index b07061b..af4a4a9 100644 --- a/test/plugins/blocks/utils.test.js +++ b/test/plugins/blocks/utils.test.js @@ -13,7 +13,7 @@ /* eslint-disable no-unused-expressions */ import { expect } from '@open-wc/testing'; -import { getBlockName, getAuthorFriendlyName, convertBlockToTable } from '../../../src/plugins/blocks/utils.js'; +import { getBlockName, normalizeBlockName, convertBlockToTable } from '../../../src/plugins/blocks/utils.js'; import { mockBlock } from '../../fixtures/blocks.js'; import { CARDS_DEFAULT_STUB, CARDS_WITH_ALIGNMENT_STUB } from '../../fixtures/stubs/cards.js'; @@ -43,12 +43,12 @@ describe('Blocks Util', () => { expect(blockName).to.equal('cards'); }); }); - describe('getAuthorFriendlyName()', () => { + describe('normalizeBlockName()', () => { it('returns author friendly names', async () => { - expect(getAuthorFriendlyName('hero-main')).to.equal('Hero Main'); - expect(getAuthorFriendlyName('hero-main (layer-1)')).to.equal('Hero Main (Layer 1)'); - expect(getAuthorFriendlyName('hero-main (layer-1, Bold-italic)')).to.equal('Hero Main (Layer 1, Bold Italic)'); - expect(getAuthorFriendlyName('hero-main-foo-bar (layer-1, bold-italic, Underline)')).to.equal('Hero Main Foo Bar (Layer 1, Bold Italic, Underline)'); + expect(normalizeBlockName('hero-main')).to.equal('hero main'); + expect(normalizeBlockName('hero-main (layer-1)')).to.equal('hero main (layer 1)'); + expect(normalizeBlockName('hero-main (layer-1, bold-italic)')).to.equal('hero main (layer 1, bold italic)'); + expect(normalizeBlockName('hero-main-foo-bar (layer-1, bold-italic, underline)')).to.equal('hero main foo bar (layer 1, bold italic, underline)'); }); });