69 lines
1.8 KiB
JavaScript
69 lines
1.8 KiB
JavaScript
import { __, sprintf } from '@wordpress/i18n';
|
|
import { Icon, TextareaControl } from '@wordpress/components';
|
|
import { useState } from '@wordpress/element';
|
|
import { info as infoIcon } from '@wordpress/icons';
|
|
import { dispatch } from '@wordpress/data';
|
|
|
|
const Settings = ( { test = {} } ) => {
|
|
const [ testState, setTestState ] = useState( {
|
|
hide_css_selectors: '',
|
|
...test,
|
|
} );
|
|
|
|
const updateTest = ( value ) => {
|
|
const updatedTest = { ...testState, hide_css_selectors: value };
|
|
test.hide_css_selectors = value;
|
|
setTestState( updatedTest );
|
|
return dispatch( 'core/editor' ).editPost( {
|
|
vrts: { hide_css_selectors: value },
|
|
} );
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<div className="settings">
|
|
<p className="settings-title">
|
|
{ __(
|
|
'Hide elements from VRTs',
|
|
'visual-regression-tests'
|
|
) }
|
|
<span className="vrts-tooltip">
|
|
<span className="vrts-tooltip-icon">
|
|
<Icon icon={ infoIcon } size="20" />
|
|
</span>
|
|
<span className="vrts-tooltip-content">
|
|
<span
|
|
className="vrts-tooltip-content-inner"
|
|
dangerouslySetInnerHTML={ {
|
|
__html: sprintf(
|
|
/* translators: %1$s, %2$s: link wrapper. */
|
|
__(
|
|
'Exclude elements on this page: Add %1$sCSS selectors%2$s (as comma separated list) to exclude elements from VRTs when a new snapshot gets created.',
|
|
'visual-regression-tests'
|
|
),
|
|
'<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors" target="_blank">',
|
|
'</a>'
|
|
),
|
|
} }
|
|
></span>
|
|
</span>
|
|
</span>
|
|
</p>
|
|
|
|
<TextareaControl
|
|
placeholder={ __(
|
|
'e.g.: .lottie, #ads',
|
|
'visual-regression-tests'
|
|
) }
|
|
value={ testState.hide_css_selectors }
|
|
onChange={ ( value ) => {
|
|
updateTest( value );
|
|
} }
|
|
/>
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default Settings;
|