1ed281fdbf6aa9284055b9f436a7f3afde9fc47c

Committed 16 May 2024 03:11PM UTC coverage: 52.77% (+0.1%) from 52.638%

Build # 1ed281fdbf6aa9284055b9f436a7f3afde9fc47c

Build Type

push

github

Committed by

web-flow

Commit Message

Merge pull request #21161 from Yoast/21141-decouple-hidden-fields-for-metabox

21141 decouple hidden fields for metabox

Run Details

7363 of 13356 branches covered (55.13%)

Branch coverage included in aggregate %.

63 of 297 new or added lines in 44 files covered. (21.21%)

22 existing lines in 16 files now uncovered.

28310 of 54245 relevant lines covered (52.19%)

41409.17 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/packages/js/src/elementor/containers/SnippetEditor.js

import { compose } from "@wordpress/compose";
import { select as wpSelect, withSelect, withDispatch } from "@wordpress/data";
import { SnippetEditor } from "@yoast/search-metadata-previews";
import { __ } from "@wordpress/i18n";
import PropTypes from "prop-types";
import SnippetPreviewSection from "../../components/SnippetPreviewSection";
import withLocation from "../../helpers/withLocation";
import { strings } from "@yoast/helpers";
import { applyModifications } from "../../initializers/pluggable";
import { getCurrentReplacementVariablesForEditor } from "../replaceVars/elementor-replacevar-plugin";

const { stripHTMLTags } = strings;

/* eslint-disable complexity */
/**
 * Process the snippet editor form data before it's being displayed in the snippet preview.
 *
 * @param {Object} data                     The snippet preview data object.
 * @param {string} data.title               The snippet preview title.
 * @param {string} data.url                 The snippet preview url: baseUrl with the slug.
 * @param {string} data.description         The snippet preview description.
 * @param {string} data.filteredSEOTitle        The SEO title without separator and site title.
 * @param {Object} context                  The context surrounding the snippet editor form data.
 * @param {string} context.shortenedBaseUrl The baseUrl of the snippet preview url.
 *
 * @returns {Object} The snippet preview data object.
 */
const mapEditorDataToPreview = ( data, context ) => {
        const templates = wpSelect( "yoast-seo/editor" ).getSnippetEditorTemplates();

        // When the editor data is empty, use the templates in the preview.
        if ( data.title === "" ) {
                data.title = templates.title;
        }
        if ( data.description === "" ) {
                data.description = templates.description;
        }

        let baseUrlLength = 0;

        if ( context.shortenedBaseUrl && typeof( context.shortenedBaseUrl ) === "string" ) {
                baseUrlLength = context.shortenedBaseUrl.length;
        }

        // Replace whitespaces in the url with dashes.
        data.url = data.url.replace( /\s+/g, "-" );
        if ( data.url[ data.url.length - 1 ] === "-" ) {
                data.url = data.url.slice( 0, -1 );
        }
        // If the first symbol after the baseUrl is a hyphen, remove that hyphen.
        // This hyphen is removed because it is usually the result of the regex replacing a space it shouldn't.
        if ( data.url[ baseUrlLength ] === "-" ) {
                data.url = data.url.slice( 0, baseUrlLength ) + data.url.slice( baseUrlLength + 1 );
        }

        return {
                url: data.url,
                title: stripHTMLTags( applyModifications( "data_page_title", data.title ) ),
                description: stripHTMLTags( applyModifications( "data_meta_desc", data.description ) ),
                filteredSEOTitle: stripHTMLTags( applyModifications( "data_page_title", data.filteredSEOTitle ) ),
        };
};

/**
 * Wraps a Snippet editor with a Snippet preview section.
 *
 * @param {object} props The props.
 *
 * @returns {wp.Element} The component.
 */
const SnippetEditorWrapper = ( { location, ...restProps } ) => {
        return (
                <SnippetPreviewSection
                        icon="eye"
                        hasPaperStyle={ restProps.hasPaperStyle }
                >
                        <SnippetEditor
                                { ...restProps }
                                descriptionPlaceholder={ __( "Please provide a meta description by editing the snippet below.", "wordpress-seo" ) }
                                mapEditorDataToPreview={ mapEditorDataToPreview }
                                showCloseButton={ false }
                                idSuffix={ location }
                        />
                </SnippetPreviewSection>
        );
};

SnippetEditorWrapper.propTypes = {
        hasPaperStyle: PropTypes.bool.isRequired,
        location: PropTypes.string.isRequired,
};

export default compose( [
        withSelect( select => {
                const {
                        getBaseUrlFromSettings,
                        getDateFromSettings,
                        getEditorDataImageUrl,
                        getFocusKeyphrase,
                        getRecommendedReplaceVars,
                        getSiteIconUrlFromSettings,
                        getSnippetEditorData,
                        getSnippetEditorMode,
                        getSnippetEditorWordsToHighlight,
                        isCornerstoneContent,
                        getContentLocale,
                        getSiteName,
                } = select( "yoast-seo/editor" );

                return {
                        baseUrl: getBaseUrlFromSettings(),
                        data: getSnippetEditorData(),
                        date: getDateFromSettings(),
                        faviconSrc: getSiteIconUrlFromSettings(),
                        keyword: getFocusKeyphrase(),
                        mobileImageSrc: getEditorDataImageUrl(),
                        mode: getSnippetEditorMode(),
                        recommendedReplacementVariables: getRecommendedReplaceVars(),
                        replacementVariables: getCurrentReplacementVariablesForEditor(),
                        wordsToHighlight: getSnippetEditorWordsToHighlight(),
                        isCornerstone: isCornerstoneContent(),
                        locale: getContentLocale(),
                        siteName: getSiteName(),
                };
        } ),
        withDispatch( dispatch => {
                const {
                        updateData,
                        switchMode,
                        updateAnalysisData,
                } = dispatch( "yoast-seo/editor" );

                return {
                        onChange: ( key, value ) => {
                                switch ( key ) {
                                        case "mode":
                                                switchMode( value );
                                                break;
                                        default:
                                                updateData( {
                                                        [ key ]: value,
                                                } );
                                                break;
                                }
                        },
                        onChangeAnalysisData: updateAnalysisData,
                };
        } ),
        withLocation(),
] )( SnippetEditorWrapper );
/* eslint-enable complexity */

1	import { compose } from "@wordpress/compose";
2	import { select as wpSelect, withSelect, withDispatch } from "@wordpress/data";
3	import { SnippetEditor } from "@yoast/search-metadata-previews";
4	import { __ } from "@wordpress/i18n";
5	import PropTypes from "prop-types";
6	import SnippetPreviewSection from "../../components/SnippetPreviewSection";
7	import withLocation from "../../helpers/withLocation";
8	import { strings } from "@yoast/helpers";
9	import { applyModifications } from "../../initializers/pluggable";
10	import { getCurrentReplacementVariablesForEditor } from "../replaceVars/elementor-replacevar-plugin";
11
12	const { stripHTMLTags } = strings;	×
13
14	/* eslint-disable complexity */
15	/**
16	* Process the snippet editor form data before it's being displayed in the snippet preview.
17	*
18	* @param {Object} data The snippet preview data object.
19	* @param {string} data.title The snippet preview title.
20	* @param {string} data.url The snippet preview url: baseUrl with the slug.
21	* @param {string} data.description The snippet preview description.
22	* @param {string} data.filteredSEOTitle The SEO title without separator and site title.
23	* @param {Object} context The context surrounding the snippet editor form data.
24	* @param {string} context.shortenedBaseUrl The baseUrl of the snippet preview url.
25	*
26	* @returns {Object} The snippet preview data object.
27	*/
28	const mapEditorDataToPreview = ( data, context ) => {	×
29	const templates = wpSelect( "yoast-seo/editor" ).getSnippetEditorTemplates();	×
30
31	// When the editor data is empty, use the templates in the preview.
32	if ( data.title === "" ) {	×
33	data.title = templates.title;	×
34	}
35	if ( data.description === "" ) {	×
36	data.description = templates.description;	×
37	}
38
39	let baseUrlLength = 0;	×
40
41	if ( context.shortenedBaseUrl && typeof( context.shortenedBaseUrl ) === "string" ) {	×
42	baseUrlLength = context.shortenedBaseUrl.length;	×
43	}
44
45	// Replace whitespaces in the url with dashes.
46	data.url = data.url.replace( /\s+/g, "-" );	×
47	if ( data.url[ data.url.length - 1 ] === "-" ) {	×
48	data.url = data.url.slice( 0, -1 );	×
49	}
50	// If the first symbol after the baseUrl is a hyphen, remove that hyphen.
51	// This hyphen is removed because it is usually the result of the regex replacing a space it shouldn't.
52	if ( data.url[ baseUrlLength ] === "-" ) {	×
53	data.url = data.url.slice( 0, baseUrlLength ) + data.url.slice( baseUrlLength + 1 );	×
54	}
55
56	return {	×
57	url: data.url,
58	title: stripHTMLTags( applyModifications( "data_page_title", data.title ) ),
59	description: stripHTMLTags( applyModifications( "data_meta_desc", data.description ) ),
60	filteredSEOTitle: stripHTMLTags( applyModifications( "data_page_title", data.filteredSEOTitle ) ),
61	};
62	};
63
64	/**
65	* Wraps a Snippet editor with a Snippet preview section.
66	*
67	* @param {object} props The props.
68	*
69	* @returns {wp.Element} The component.
70	*/
NEW 71	const SnippetEditorWrapper = ( { location, ...restProps } ) => {	×
72	return (	×
73	<SnippetPreviewSection
74	icon="eye"
75	hasPaperStyle={ restProps.hasPaperStyle }
76	>
77	<SnippetEditor
78	{ ...restProps }
79	descriptionPlaceholder={ __( "Please provide a meta description by editing the snippet below.", "wordpress-seo" ) }
80	mapEditorDataToPreview={ mapEditorDataToPreview }
81	showCloseButton={ false }
82	idSuffix={ location }
83	/>
84	</SnippetPreviewSection>
85	);
86	};
87
88	SnippetEditorWrapper.propTypes = {	×
89	hasPaperStyle: PropTypes.bool.isRequired,
90	location: PropTypes.string.isRequired,
91	};
92
93	export default compose( [
94	withSelect( select => {
95	const {
96	getBaseUrlFromSettings,
97	getDateFromSettings,
98	getEditorDataImageUrl,
99	getFocusKeyphrase,
100	getRecommendedReplaceVars,
101	getSiteIconUrlFromSettings,
102	getSnippetEditorData,
103	getSnippetEditorMode,
104	getSnippetEditorWordsToHighlight,
105	isCornerstoneContent,
106	getContentLocale,
107	getSiteName,
108	} = select( "yoast-seo/editor" );	×
109
110	return {	×
111	baseUrl: getBaseUrlFromSettings(),
112	data: getSnippetEditorData(),
113	date: getDateFromSettings(),
114	faviconSrc: getSiteIconUrlFromSettings(),
115	keyword: getFocusKeyphrase(),
116	mobileImageSrc: getEditorDataImageUrl(),
117	mode: getSnippetEditorMode(),
118	recommendedReplacementVariables: getRecommendedReplaceVars(),
119	replacementVariables: getCurrentReplacementVariablesForEditor(),
120	wordsToHighlight: getSnippetEditorWordsToHighlight(),
121	isCornerstone: isCornerstoneContent(),
122	locale: getContentLocale(),
123	siteName: getSiteName(),
124	};
125	} ),
126	withDispatch( dispatch => {
127	const {
128	updateData,
129	switchMode,
130	updateAnalysisData,
UNCOV 131	} = dispatch( "yoast-seo/editor" );	×
132
133	return {	×
134	onChange: ( key, value ) => {
135	switch ( key ) {	×
136	case "mode":
137	switchMode( value );	×
138	break;	×
139	default:
140	updateData( {	×
141	[ key ]: value,
142	} );
143	break;	×
144	}
145	},
146	onChangeAnalysisData: updateAnalysisData,
147	};
148	} ),
149	withLocation(),
150	] )( SnippetEditorWrapper );
151	/* eslint-enable complexity */

Yoast / wordpress-seo / 1ed281fdbf6aa9284055b9f436a7f3afde9fc47c

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous