Make WordPress Core

Opened 9 months ago

Last modified 3 weeks ago

#44839 assigned enhancement

Privacy-data-requests-tables: Remove inline CSS, move it into a css file instead

Reported by: birgire Owned by: desrosj
Milestone: 5.3 Priority: low
Severity: normal Version: 4.9.6
Component: Privacy Keywords: has-patch needs-testing
Focuses: Cc:


In WP_Privacy_Data_Export_Requests_Table we have inline CSS:

$download_data_markup .= '<span class="export-personal-data-idle"><button type="button" class="button-link export-personal-data-handle">' . __( 'Download Personal Data' ) . '</button></span>' .
  '<span style="display:none" class="export-personal-data-processing" >' . __( 'Downloading Data...' ) . '</span>' .
  '<span style="display:none" class="export-personal-data-success"><button type="button" class="button-link export-personal-data-handle">' . __( 'Download Personal Data Again' ) . '</button></span>' .
  '<span style="display:none" class="export-personal-data-failed">' . __( 'Download has failed.' ) . ' <button type="button" class="button-link">' . __( 'Retry' ) . '</button></span>';

  <span class="export-personal-data-idle"><button type="button" class="button export-personal-data-handle"><?php _e( 'Email Data' ); ?></button></span>
  <span style="display:none" class="export-personal-data-processing button updating-message" ><?php _e( 'Sending Email...' ); ?></span>
  <span style="display:none" class="export-personal-data-success success-message" ><?php _e( 'Email sent.' ); ?></span>
  <span style="display:none" class="export-personal-data-failed"><?php _e( 'Email could not be sent.' ); ?> <button type="button" class="button export-personal-data-handle"><?php _e( 'Retry' ); ?></button></span>

and in WP_Privacy_Data_Removal_Requests_Table we have:

  $remove_data_markup .= '<span class="remove-personal-data-idle"><button type="button" class="button-link remove-personal-data-handle">' . __( 'Force Erase Personal Data' ) . '</button></span>' .
    '<span style="display:none" class="remove-personal-data-processing" >' . __( 'Erasing Data...' ) . '</span>' .
    '<span style="display:none" class="remove-personal-data-failed">' . __( 'Force Erase has failed.' ) . ' <button type="button" class="button-link remove-personal-data-handle">' . __( 'Retry' ) . '</button></span>';

    <span class="remove-personal-data-idle"><button type="button" class="button remove-personal-data-handle"><?php _e( 'Erase Personal Data' ); ?></button></span>
    <span style="display:none" class="remove-personal-data-processing button updating-message" ><?php _e( 'Erasing Data...' ); ?></span>
    <span style="display:none" class="remove-personal-data-failed"><?php _e( 'Erasing Data has failed.' ); ?> <button type="button" class="button remove-personal-data-handle"><?php _e( 'Retry' ); ?></button></span>

I wonder if we could remove this inline CSS and instead add something like:

.export-personal-data-failed {
	display: none;

in list-tables.css ?

Attachments (3)

44839.diff (5.0 KB) - added by pratikthink 9 months ago.
As birgire suggested
44839.2.diff (5.2 KB) - added by xkon 2 months ago.
removes inline css, adds hidden class, updates xfn.js
44839.3.diff (4.8 KB) - added by garrett-eclipse 3 weeks ago.
Refreshed patch, also moved the hidden classes to the end of the class attribute

Download all attachments as: .zip

Change History (18)

#1 @SergeyBiryukov
9 months ago

  • Keywords needs-patch added

9 months ago

As birgire suggested

#2 @pratikthink
9 months ago

  • Keywords has-patch needs-testing added; needs-patch removed

#3 @garrett-eclipse
7 months ago

  • Milestone changed from Awaiting Review to 5.0.1

#4 @pento
5 months ago

  • Milestone changed from 5.0.1 to 5.0.2

#5 @pento
5 months ago

  • Milestone changed from 5.0.2 to 5.0.3

#6 @desrosj
5 months ago

  • Milestone changed from 5.0.3 to 5.1

This needs testing still. Let's punt to 5.1.

#7 @desrosj
4 months ago

  • Owner set to desrosj
  • Status changed from new to assigned

Thanks for the patch, @pratikthink!

@birgire my initial testing looks good for this. Are you able to give this some testing?

I also think we should utilize the .hidden class that already exists for this instead.

#8 @pento
4 months ago

  • Keywords needs-refresh added
  • Milestone changed from 5.1 to Future Release

I'm inclined to agree that it should use the .hidden class.

This should probably also update setActionState() in xfn.js to add/remove the hidden class, instead of using hide() and show().

2 months ago

removes inline css, adds hidden class, updates xfn.js

#9 @xkon
2 months ago

  • Keywords needs-refresh removed

44839.2.diff removes the inline css that we've added initially and instead uses the .hidden class.

This ticket was mentioned in Slack in #core-privacy by xkon. View the logs.

2 months ago

#11 @garrett-eclipse
2 months ago

  • Keywords commit added; needs-testing removed

Thanks @xkon testing this it works nicely using the .hidden over the inline css and hide/show. I tested on both Export and Erase screens. I'm marking it for commit, but am unsure if it missed the 5.2 ship so am leaving on the Future Milestone.

#12 @garrett-eclipse
2 months ago

  • Milestone changed from Future Release to 5.2

With 5.2 beta1 pushed till March 27th there should be enough time to address this so am Milestoning to 5.2, if it doesn't make the cut we can always push to 5.3.

#13 @desrosj
2 months ago

  • Milestone changed from 5.2 to 5.3

The beta was extended to allow a specific set of enhancements to be polished for inclusion, so let's push this so we do not distract from those specific tickets (Site Health, signed updates, etc.).

This could also be considered for 5.2.1 when the time comes.

#14 @desrosj
3 weeks ago

  • Keywords needs-refresh added; commit removed

The latest patch is no longer applying. Can someone refresh it?

3 weeks ago

Refreshed patch, also moved the hidden classes to the end of the class attribute

#15 @garrett-eclipse
3 weeks ago

  • Keywords needs-testing added; needs-refresh removed

Hi @desrosj I've refreshed this in 44839.3.diff, can you please test.

I made one change from the previous patch which was to move the hidden classes to the end of the class attributes, as they get removed/added, this placement will have less of a visual change for inspector.

Note: See TracTickets for help on using tickets.