Skip to content

fix(ios): scroll assist sizes input correctly - #27253

Merged
liamdebeasi merged 1 commit into
mainfrom
FW-4104
Apr 20, 2023
Merged

fix(ios): scroll assist sizes input correctly#27253
liamdebeasi merged 1 commit into
mainfrom
FW-4104

Conversation

@liamdebeasi

@liamdebeasi liamdebeasi commented Apr 20, 2023

Copy link
Copy Markdown
Contributor

Issue number: resolves #27249


What is the current behavior?

The cloned input/textarea for scroll assist is not sized correctly. For legacy inputs, this causes the clone to be off by ~1px because it does not have the correct height. For modern inputs, this causes the same bug as the legacy inputs plus cloned inputs overlap any floating/stacked labels. This was not a concern for legacy inputs because those inputs did not contain the label element where modern inputs do.

What is the new behavior?

  • Sets bottom: 0 for cloned inputs so they have the correct height
  • Sets position: relative on the .native-wrapper so the cloned input does not flow outside of the parent container.

Before

Modern Input Legacy Input
RPReplay_Final1681998081.MP4
RPReplay_Final1681998149.MP4

(Note: The legacy input bug is subtle -- the input only shifts by ~1px)

After

Modern Input Legacy Input
modernafter.mp4
legacyafter.mp4

Does this introduce a breaking change?

  • Yes
  • No

Other information

@bolt-new-by-stackblitz

Copy link
Copy Markdown

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@github-actions github-actions Bot added the package: core @ionic/core package label Apr 20, 2023
@liamdebeasi
liamdebeasi marked this pull request as ready for review April 20, 2023 13:48
@liamdebeasi
liamdebeasi requested a review from a team as a code owner April 20, 2023 13:48

@sean-perkins sean-perkins left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Nice work! I was just looking at this one in Discord last night.

@liamdebeasi
liamdebeasi added this pull request to the merge queue Apr 20, 2023
@github-merge-queue
github-merge-queue Bot removed this pull request from the merge queue due to failed status checks Apr 20, 2023
@liamdebeasi
liamdebeasi added this pull request to the merge queue Apr 20, 2023
@github-merge-queue
github-merge-queue Bot removed this pull request from the merge queue due to failed status checks Apr 20, 2023
@liamdebeasi
liamdebeasi added this pull request to the merge queue Apr 20, 2023
Merged via the queue into main with commit a874992 Apr 20, 2023
@liamdebeasi
liamdebeasi deleted the FW-4104 branch April 20, 2023 16:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

package: core @ionic/core package

Projects

None yet

Development

Successfully merging this pull request may close these issues.

bug: iOS Scroll Assist - Focus on ion-input cloned input moves input up visually

2 participants