Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Simple Payments Block: Fix email field cut and paste bug #15145

Merged
merged 1 commit into from
Mar 27, 2020

Conversation

glendaviesnz
Copy link
Contributor

@glendaviesnz glendaviesnz commented Mar 27, 2020

Currently the Gutenberg paste handler is bypassed for input fields of type text, but not of type email, which causes the block to be killed and replaced with a paragraph if text is pasted into the email field.

Fixes #15121
Fixes #11906

Changes proposed in this Pull Request:

  • Temporarily change email field type to text to prevent gutenberg paste handler hijacking native copy/cut/past for the field.

Testing instructions:

  • Add this patch to local jetpack text env, along with latest gutenberg plugin
  • Add Simple Payments Block
  • Try cutting and pasting in the email field - should work as expected
  • Try removing focus from block and then selecting and cut/paste email field again
  • Try loading a page with block saved and make sure no console errors

before:

before

after:

after

Proposed changelog entry for your changes:

  • No entry needed

@glendaviesnz glendaviesnz added [Type] Bug When a feature is broken and / or not performing as intended [Status] Needs Team Review labels Mar 27, 2020
@glendaviesnz glendaviesnz requested a review from a team as a code owner March 27, 2020 03:28
@glendaviesnz glendaviesnz self-assigned this Mar 27, 2020
@matticbot
Copy link
Contributor

Caution: This PR has changes that must be merged to WordPress.com
Hello glendaviesnz! These changes need to be synced to WordPress.com - If you 're an a11n, please commandeer, review, and approve D40949-code before merging this PR. Thank you!

@jetpackbot
Copy link

Thank you for the great PR description!

When this PR is ready for review, please apply the [Status] Needs Review label. If you are an a11n, please have someone from your team review the code if possible. The Jetpack team will also review this PR and merge it to be included in the next Jetpack release.

Scheduled Jetpack release: April 7, 2020.
Scheduled code freeze: March 31, 2020

Generated by 🚫 dangerJS against de1ce75

@scruffian
Copy link
Member

Is this tracked in in the Gutenberg repo? Is that what WordPress/gutenberg#12780 is?

Copy link
Member

@scruffian scruffian left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can confirm that this fixes the bug. We should merge, but we should also make sure it's tracked in core.

@jeherve jeherve added this to the 8.4 milestone Mar 27, 2020
@jeherve jeherve added [Status] Ready to Merge Go ahead, you can push that green button! and removed [Status] Needs Team Review labels Mar 27, 2020
Copy link
Member

@jeherve jeherve left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should do the trick for now 👍

@scruffian scruffian merged commit 2362716 into master Mar 27, 2020
@scruffian scruffian deleted the fix/email-field-paste-alternative branch March 27, 2020 16:57
@matticbot matticbot added [Status] Needs Changelog and removed [Status] Ready to Merge Go ahead, you can push that green button! labels Mar 27, 2020
@scruffian
Copy link
Member

r205001-wpcom

jeherve added a commit that referenced this pull request Mar 31, 2020
jeherve added a commit that referenced this pull request Mar 31, 2020
* Initial changelog entry

* Changelog: add #14904

* Changelog: add #14910

* Changelog: add #14913

* Changelog: add #14916

* Changelog: add #14922

* Changelog: add #14924

* Changelog: add #14925

* Changelog: add #14928

* Changelog: add #14840

* Changelog: add #14841

* Changelog: add #14842

* Changelog: add #14826

* Changelog: add #14835

* Changelog: add #14859

* Changelog: add #14884

* Changelog: add #14888

* Changelog: add #14817

* Changelog: add #14814

* Changelog: add #14819

* Changelog;: add #14797

* Changelog: add #14798

* Changelog: add #14802

* Changelog: add #13676

* Changelog: add #13744

* Changelog: add #13777

* Changelog: add #14446

* Changelog: add #14739

* Changelog: add #14770

* Changelog: add #14784

* Changelog: add #14897

* Changelog: add #14898

* Changelog: add #14968

* Changelog: add #14985

* Changelog: add #15044

* Changelog: add #15052

* Update to remove Podcast since it remains in Beta

* Changelog: add #14803

* Changelog: add #15028

* Changelog: add #15065

* Changelog:add #14886

* Changelog: add #15118

* Changelog: add #14990

* Changelog: add #14528

* Changelog: add #15120

* Changelog: add #15126

* Changelog: add #15049

* Chanegelog: add #14852

* Changelog: add #15090

* Changelog: add #15138

* Changelog: add #15124

* Changelog:add #15055

* Changelog: add #15017

* Changelog: add #15109

* Changelog: add #15145

* Changelog:add #15096

* Changelog:add #15153

* Changelog: add #15133

* Changelog: add #14960

* Changelog: add #15127

* Changelog: add #15056

* Copy current changelog to changelog archive.

* Clarify changelog description
@@ -524,7 +524,8 @@ class SimplePaymentsEdit extends Component {
onChange={ this.handleEmailChange }
placeholder={ __( 'Email', 'jetpack' ) }
required
type="email"
// TODO: switch this back to type="email" once Gutenberg paste handler ignores inputs of type email
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Age-old PR but came up in my search when looking for something else...

You could use inputmode="email" meanwhile to get the right keyboard on mobile. Otherwise, the type doesn't matter that much.

https://css-tricks.com/everything-you-ever-wanted-to-know-about-inputmode/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Touches WP.com Files [Type] Bug When a feature is broken and / or not performing as intended
Projects
None yet
6 participants