-
Notifications
You must be signed in to change notification settings - Fork 219
Fixes for jest transpilation issues. #10788
Changes from 10 commits
e8d2fa2
02750f1
acbb01d
62f1eb0
4a892e7
80b00ef
e479c88
c433455
5287e3b
b1342e2
f3ac98c
93015e3
88e2e48
15255f8
881cb4d
1c6772b
32161ca
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,155 @@ | ||
export function trimHtml( html, options ) { | ||
options = options || {}; | ||
|
||
const limit = options.limit || 100, | ||
preserveTags = | ||
typeof options.preserveTags !== 'undefined' | ||
? options.preserveTags | ||
: true, | ||
wordBreak = | ||
typeof options.wordBreak !== 'undefined' | ||
? options.wordBreak | ||
: false, | ||
suffix = options.suffix || '...', | ||
moreLink = options.moreLink || '', | ||
moreText = options.moreText || '»', | ||
preserveWhiteSpace = options.preserveWhiteSpace || false; | ||
|
||
const arr = html | ||
.replace( /</g, '\n<' ) | ||
.replace( />/g, '>\n' ) | ||
.replace( /\n\n/g, '\n' ) | ||
.replace( /^\n/g, '' ) | ||
.replace( /\n$/g, '' ) | ||
.split( '\n' ); | ||
|
||
let sum = 0, | ||
row, | ||
cut, | ||
add, | ||
rowCut, | ||
tagMatch, | ||
tagName, | ||
// eslint-disable-next-line prefer-const | ||
tagStack = [], | ||
more = false; | ||
|
||
for ( let i = 0; i < arr.length; i++ ) { | ||
row = arr[ i ]; | ||
|
||
// count multiple spaces as one character | ||
if ( ! preserveWhiteSpace ) { | ||
rowCut = row.replace( /[ ]+/g, ' ' ); | ||
} else { | ||
rowCut = row; | ||
} | ||
|
||
if ( ! row.length ) { | ||
continue; | ||
} | ||
|
||
const charArr = getCharArr( rowCut ); | ||
|
||
if ( row[ 0 ] !== '<' ) { | ||
if ( sum >= limit ) { | ||
row = ''; | ||
} else if ( sum + charArr.length >= limit ) { | ||
cut = limit - sum; | ||
|
||
if ( charArr[ cut - 1 ] === ' ' ) { | ||
while ( cut ) { | ||
cut -= 1; | ||
if ( charArr[ cut - 1 ] !== ' ' ) { | ||
break; | ||
} | ||
} | ||
} else { | ||
add = charArr.slice( cut ).indexOf( ' ' ); | ||
|
||
// break on halh of word | ||
if ( ! wordBreak ) { | ||
if ( add !== -1 ) { | ||
cut += add; | ||
} else { | ||
cut = row.length; | ||
} | ||
} | ||
} | ||
|
||
row = charArr.slice( 0, cut ).join( '' ) + suffix; | ||
|
||
if ( moreLink ) { | ||
row += | ||
'<a href="' + | ||
moreLink + | ||
'" style="display:inline">' + | ||
moreText + | ||
'</a>'; | ||
} | ||
|
||
sum = limit; | ||
more = true; | ||
} else { | ||
sum += charArr.length; | ||
} | ||
} else if ( ! preserveTags ) { | ||
row = ''; | ||
} else if ( sum >= limit ) { | ||
tagMatch = row.match( /[a-zA-Z]+/ ); | ||
tagName = tagMatch ? tagMatch[ 0 ] : ''; | ||
|
||
if ( tagName ) { | ||
if ( row.substring( 0, 2 ) !== '</' ) { | ||
tagStack.push( tagName ); | ||
row = ''; | ||
} else { | ||
while ( | ||
tagStack[ tagStack.length - 1 ] !== tagName && | ||
tagStack.length | ||
) { | ||
tagStack.pop(); | ||
} | ||
|
||
if ( tagStack.length ) { | ||
row = ''; | ||
} | ||
|
||
tagStack.pop(); | ||
} | ||
} else { | ||
row = ''; | ||
} | ||
} | ||
|
||
arr[ i ] = row; | ||
} | ||
|
||
return { | ||
html: arr.join( '\n' ).replace( /\n/g, '' ), | ||
more, | ||
}; | ||
} | ||
|
||
// count symbols like one char | ||
function getCharArr( rowCut ) { | ||
// eslint-disable-next-line prefer-const | ||
let charArr = [], | ||
subRow, | ||
match, | ||
char; | ||
|
||
for ( let i = 0; i < rowCut.length; i++ ) { | ||
subRow = rowCut.substring( i ); | ||
match = subRow.match( /^&[a-z0-9#]+;/ ); | ||
|
||
if ( match ) { | ||
char = match[ 0 ]; | ||
charArr.push( char ); | ||
i += char.length - 1; | ||
} else { | ||
charArr.push( rowCut[ i ] ); | ||
} | ||
} | ||
|
||
return charArr; | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -32,6 +32,11 @@ import OrderSummarySubtotalBlock from '../inner-blocks/cart-order-summary-subtot | |
import OrderSummaryShippingBlock from '../inner-blocks/cart-order-summary-shipping/frontend'; | ||
import OrderSummaryTaxesBlock from '../inner-blocks/cart-order-summary-taxes/frontend'; | ||
|
||
jest.mock( '@wordpress/compose', () => ( { | ||
...jest.requireActual( '@wordpress/compose' ), | ||
useResizeObserver: jest.fn().mockReturnValue( [ null, { width: 0 } ] ), | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. As mentioned in my commit this is something I have actually run into before, if you're including useResizeObserver as a dependency outside of WP (such as in a jest test) then you get an error because the underlying library (react-resize-aware) cannot access the jsx runtime due to how it's built. See FezVrasta/react-resize-aware#58 If we had pnpm we could force resolution to a newer version, but in npm the solutions to this are hackier so we just stub it out here instead. |
||
} ) ); | ||
|
||
const CartBlock = ( { | ||
attributes = { | ||
showRateAfterTaxName: false, | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -7,7 +7,31 @@ import { render, queryByText } from '@testing-library/react'; | |
* Internal dependencies | ||
*/ | ||
import { Edit } from '../edit'; | ||
const blockSettingsMock = jest.requireMock( '@woocommerce/block-settings' ); | ||
|
||
jest.mock( '@wordpress/data', () => ( { | ||
...jest.requireActual( '@wordpress/data' ), | ||
useSelect: jest.fn().mockImplementation( ( fn ) => { | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. This was a bit tricky, I had to mock a few useSelect cases to avoid exceptions in underlying RichText component. |
||
const select = () => { | ||
return { | ||
getSelectionStart: () => ( { | ||
clientId: null, | ||
} ), | ||
getSelectionEnd: () => ( { | ||
clientId: null, | ||
} ), | ||
getFormatTypes: () => [], | ||
}; | ||
}; | ||
|
||
if ( typeof fn === 'function' ) { | ||
return fn( select ); | ||
} | ||
|
||
return { | ||
isCaretWithinFormattedText: () => false, | ||
}; | ||
} ), | ||
} ) ); | ||
|
||
jest.mock( '@wordpress/block-editor', () => ( { | ||
...jest.requireActual( '@wordpress/block-editor' ), | ||
|
@@ -21,6 +45,8 @@ jest.mock( '@woocommerce/block-settings', () => ( { | |
TERMS_URL: '/terms-and-conditions', | ||
} ) ); | ||
|
||
const blockSettingsMock = jest.requireMock( '@woocommerce/block-settings' ); | ||
|
||
describe( 'Edit', () => { | ||
it( 'Renders a checkbox if the checkbox attribute is true', async () => { | ||
const { container } = render( | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This change is a bit crazy. I'm not sure how we never ran into this, maybe because technically its ok not to declare a variable before access but I thought browsers having use strict would make this throw.
So the issue is that in the published version of trim-html there is no declaration of the variable
rowCut
which causes tests to throw an exception. You can verify the declaration is missing by downloading the npm module and checking the source.This uses the repository source which has the problem fixed. I did consider implementing something myself with Domparser but decided against it because there is nuanced behaviour of the truncation. Thankfully we have tests covering regressions here.
We could also use a tool like patch package if its preferred. https://www.npmjs.com/package/patch-package
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I would add a comment that explains that this code is copy-pasted.