Cleanup Privacy .wp-policy-help CSS remnants (Broken back-compat)

[garrett-eclipse]

Hello,

This comes from a discovery in #44588 that we updated the original .wp-policy-help class to be .privacy-policy-tutorial in Changeset#43184.

There seems to be some remnant CSS in the TinyMCE CSS;
​https://github.com/WordPress/wordpress-develop/blob/6b366c6620fdd5960cedcdf80955966a715efa82/src/js/_enqueues/vendor/tinymce/skins/wordpress/wp-content.css#L268-L271

One issue I've recently run into with the class change is it doesn't seem to have been properly disclosed to developers in a dev-note or otherwise so many plugins (such as WooCommerce, ​example) still utilize the old CSS class and as such their tutorial text is being copied along with the suggested text when the user goes to copy the section policy text.
*wpdirectory.net is currently not listing names but indicates there's 52 plugin matches and 3 theme matches.

CC @azaozz - As the original committer I wanted your advice. Should we update the copy code to support both classes and as such all existing plugins, or maybe setup a dev-note or reach out to the plugin developers to prompt them to update and use the more appropriate .privacy-policy-tutorial class?

Thank you

[garrett-eclipse]

The specialized class .privacy-policy-tutorial should probably be added to the docblock for wp_add_privacy_policy_content so it's mentioned in the function reference and then we can also mention it in the handbook here;
Handbook - ​https://developer.wordpress.org/plugins/privacy/suggesting-text-for-the-site-privacy-policy/
Function Reference - ​https://developer.wordpress.org/reference/functions/wp_add_privacy_policy_content/

[azaozz]

Replying to garrett-eclipse:

The specialized class .privacy-policy-tutorial should probably be added to the docblock for wp_add_privacy_policy_content so it's mentioned in the function reference and then we can also mention it in the handbook here;

Yep, good idea.

their tutorial text is being copied along with the suggested text...

Yeah, can (probably) add the old class to https://core.trac.wordpress.org/browser/tags/5.3.2/src/wp-admin/css/edit.css#L732 so the content is hidden when copying the text (the way that works is the browser would only copy the visible text, so we hide the explanatory parts temporarily just before copying, then show them again). Looks like it would only need to add the .hide-privacy-policy-tutorial .wp-policy-help selector there.

Regarding TinyMCE, thinking that CSS should just be removed. Seems it was left there unintentionally.

Could you make a patch? :)

[garrett-eclipse]

Thanks @azaozz I've uploaded 49282.diff to account for these items;

1. Deprecate .wp-policy-help from the tinymce css.
2. Add back-compat CSS to hide .wp-policy-help from the copy command, and remove italic font so it displays and functions the same as .privacy-policy-tutorial
3. I've added the following to the docblock for wp_add_privacy_policy_content in order to introduce this to the Function Reference. It's a little verbose so if there's any feedback on making it more concise I'm open to that.

The HTML contents of the $policy_text supports use of a specialized privacy-policy-tutorial css class which can be used to provide supplemental information. Any content contained within html elements that have the privacy-policy-tutorial css class applied will be omitted from the clipboard when the section content is copied.

4. [NEW] While testing I found the tutorial text of plugins and suggested text didn't have the same styling and found when the wp-suggested-text div and italic css was added in Changeset#43184 it didn't apply to the plugin suggested text. To rectify this I've updated the css to use the other policy-text css wrapper as it applied both to the WP and plugin suggested text content.

The only other difference now I'm seeing is the plugins often don't use the <strong class="privacy-policy-tutorial">Suggested Text:</strong> prefix on their content. That's more of an education thing though and can be handled in the documentation example found here;
​https://developer.wordpress.org/plugins/privacy/suggesting-text-for-the-site-privacy-policy/

Can you review @azaozz and was wondering if this would warrant a dev-note or if that ship has sailed and maybe we get the plugins team to reach out to affected themes/plugins in order to prompt them to change from using wp-policy-help to privacy-policy-tutorial so they can support WP users from 5.1>5.4 who would be affected by the back-compat reversion?

[garrett-eclipse]

Patch to address the back-compat issues

[azaozz]

[NEW] While testing I found the tutorial text of plugins and suggested text didn't have the same styling and found when the wp-suggested-text div...

Not sure if we should change that. If the plugins wanted to reuse WP's styling, they could have done that easily. They had couple of years to do that.

The rest looks good, thanks for the patch :)

Re: dev. note. Not really sure if this change is large enough. Thinking best to leave it in the hands of the Docs Coordinator for 5.4

[garrett-eclipse]

Revert styling change selector back to .wp-suggested-text from .policy-text

[garrett-eclipse]

Thanks for the feedback @azaozz I've reverted the css class selector from .policy-text back to .wp-suggested-text in 49828.2.diff

[azaozz]

In 47112:

Privacy: Cleanup .wp-policy-help CSS remnants and add back-compat when hiding the tutorial content before copying.

Props garrett-eclipse.
Fixes #49282.

[SergeyBiryukov]

In 47113:

Docs: Remove extra trailing spaces from wp_add_privacy_policy_content() DocBlock to fix WPCS issues, apply minor formatting changes for consistency.

Follow-up to [47112].

See #49282.

[garrett-eclipse]

Note: I've realized I misunderstood when the original changes happened. Apparently #43473 introduced the change to trunk but #43980 replaced it before 4.9.6 was even released so for all public releases it's always used .privacy-policy-tutorial. Updating versions.

[pputzer]

Replying to azaozz:

[NEW] While testing I found the tutorial text of plugins and suggested text didn't have the same styling and found when the wp-suggested-text div...

Not sure if we should change that. If the plugins wanted to reuse WP's styling, they could have done that easily. They had couple of years to do that.

Only if they had been aware of the issue. Since there is very little documentation available, it's no surprise that they didn't. I don't think having plugins add an additional and semantically meaningless <div> is good practice. Instead, Core should make it easier to have consistent styling in the privacy policy guide automatically.

[garrett-eclipse]

Update selector to .policy-text from .wp-suggested-text to apply new styling from #44621 to plugins for consistent UI

[garrett-eclipse]

3rd party plugins like WooCommerce/Ninja Forms weren't following the new styling as they hadn't adopted the .wp-suggested-text div

[garrett-eclipse]

Screen to illustrate result of patch making the styling consistent across core and plugins.

[garrett-eclipse]

Thanks @pputzer I agree considering the documentation makes no mention of the .wp-suggested-text div.
Docs Reference - ​https://developer.wordpress.org/plugins/privacy/suggesting-text-for-the-site-privacy-policy/

Also with the UI changing in #44621 the plugins that haven't adopted this div aren't styled consistently leading to a non-consistent UI.

In 49282.3.diff I've updated the selectors which brings conformity across core and plugin suggested privacy text. As well I added a 1em bottom margin to ensure the white background tutorial sections don't butt up against the Copy button.

Reopening to revisit and hopefully have the UI changes in 5.4 apply to plugins as well as core.

[pputzer]

Replying to garrett-eclipse:

In 49282.3.diff I've updated the selectors which brings conformity across core and plugin suggested privacy text. As well I added a 1em bottom margin to ensure the white background tutorial sections don't butt up against the Copy button.

Thank you! (Especially for adding the missing margin, which I noticed yesterday while committing the extra div to the development branch of Avatar Privacy, but didn't report yet.)

[johnbillion]

In 47411:

Privacy: Reintroduce consistency to the styling of suggested privacy text from core and plugins.

Props garrett-eclipse

Fixes #49282