fix(core): set scroll boundary to nearest #6310

ninaandal · 2024-04-10T12:39:40Z

Description

There was an issue with deleting characters in a pte where the length of the paragraph exceeded the size of the box - it would jump to the top of the pte.

By setting the block in the scrollIntoView() to nearest instead of start, which means the browser will align leafEl with the least amount of vertical movement.

Screen.Recording.2024-04-10.at.14.37.46.mov

Fixes 5648

What to review

Deleting characters will not cause the view to jump to the top.

Testing

Notes for release

Fixes issue where the cursor would move out of viewpoint when deleting a character in PTE.
Does changing this have any other implications in the studio?

vercel · 2024-04-10T12:39:48Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
performance-studio	✅ Ready (Inspect)	Visit Preview		Apr 29, 2024 9:44am
test-next-studio	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Apr 29, 2024 9:44am
test-studio	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Apr 29, 2024 9:44am

1 Ignored Deployment

Name	Status	Preview	Comments	Updated (UTC)
studio-workshop	⬜️ Ignored (Inspect)	Visit Preview		Apr 29, 2024 9:44am

github-actions · 2024-04-10T12:40:24Z

No changes to documentation

github-actions · 2024-04-10T12:46:45Z

Component Testing Report Updated Apr 29, 2024 9:49 AM (UTC)

File	Status	Duration	Passed	Skipped
comments/CommentInput.spec.tsx	✅ Passed (Inspect)	36s	15	0
formBuilder/ArrayInput.spec.tsx	✅ Passed (Inspect)	7s	3	0
formBuilder/inputs/PortableText/Annotations.spec.tsx	✅ Passed (Inspect)	28s	6	0
formBuilder/inputs/PortableText/copyPaste/CopyPaste.spec.tsx	✅ Passed (Inspect)	13s	4	2
formBuilder/inputs/PortableText/Decorators.spec.tsx	✅ Passed (Inspect)	14s	6	0
formBuilder/inputs/PortableText/FocusTracking.spec.tsx	✅ Passed (Inspect)	36s	15	0
formBuilder/inputs/PortableText/Input.spec.tsx	✅ Passed (Inspect)	1m 7s	15	0
formBuilder/inputs/PortableText/ObjectBlock.spec.tsx	✅ Passed (Inspect)	1m 6s	18	0
formBuilder/inputs/PortableText/RangeDecoration.spec.tsx	✅ Passed (Inspect)	21s	9	0
formBuilder/inputs/PortableText/Styles.spec.tsx	✅ Passed (Inspect)	15s	6	0
formBuilder/inputs/PortableText/Toolbar.spec.tsx	✅ Passed (Inspect)	23s	9	0

packages/sanity/src/core/form/inputs/PortableText/hooks/useScrollSelectionIntoView.tsx

skogsmaskin · 2024-04-17T12:57:40Z

@ninaandal - I'm currently looking a bit into the underlaying code here as I think it's trying to scroll a bit too aggressively (we have problems elsewhere with this too).

I still need some time to review this.

skogsmaskin

Test this and it really improves the experience.

The jumping @hermanwikner is talking about I will address in another PR.

skogsmaskin

Found an issue. The 'smooth' scrolling should not be there.

Try switching to and from fullscreen mode, and you'll see the issue when focused deep down in a long document.

RitaDias · 2024-04-26T06:34:45Z

Found an issue. The 'smooth' scrolling should not be there.

Try switching to and from fullscreen mode, and you'll see the issue when focused deep down in a long document.

Good catch @skogsmaskin !
I've pushed a new commit where it removes the smooth completely from the scroll into view which feels like I might just be missing a use case. You can try it out here

Let me know if I'm missing anything 👍

skogsmaskin · 2024-04-29T09:41:13Z

Resolved conflicts and rebased this against next.

skogsmaskin

LGTM!

* fix(core): set scroll boundary to nearest * fix(core): add smooth scroll behavior * fix(sanity): remove smooth behavior --------- Co-authored-by: RitaDias <anarita151@gmail.com>

@sanity

* fix(pte): show toolbar as active only if all blocks have tool active * fix(pte): show toolbar as active only if all blocks have tool active * fix(pte): correct toggling of marks when part mark is selected * fix(core): change scrollintoview block to be nearest (#6328) * fix(core): set scroll boundary to nearest (#6310) * fix(core): set scroll boundary to nearest * fix(core): add smooth scroll behavior * fix(sanity): remove smooth behavior --------- Co-authored-by: RitaDias <anarita151@gmail.com> * fix(@sanity): issue where hidden unicode characters were bloating document in PTE (#6440) * fix(portable-text-editor): issue shown in tests re stega. use duplicate code * test(playwright-ct): add test * chore(sanity): remove prettier linting * test(sanity): fix missing snapshot * test(sanity): update test after realising the test would pass always if comparing object number * chore: test unicode removal * chore: test unicode removal * chore(@sanity): remove old solution * fix(@sanity/block-tools): unicode issue. remove vercel/stega and move to block-tools * test(@sanity/block-tools): for unicode * fix(@sanity/block-tools): utf8 characters weren't beign filtered. using the vercel/stega * chore: update lock file * (chore): update pnpm lock * chore: add codeowners to block-tools * chore(deps): dedupe pnpm-lock.yaml (#6508) Co-authored-by: github-merge-queue[bot] <118344674+github-merge-queue[bot]@users.noreply.github.com> * fix(pte): tidying implementation * fix(@sanity): issue where hidden unicode characters were bloating document in PTE (#6440) * fix(portable-text-editor): issue shown in tests re stega. use duplicate code * test(playwright-ct): add test * chore(sanity): remove prettier linting * test(sanity): fix missing snapshot * test(sanity): update test after realising the test would pass always if comparing object number * chore: test unicode removal * chore: test unicode removal * chore(@sanity): remove old solution * fix(@sanity/block-tools): unicode issue. remove vercel/stega and move to block-tools * test(@sanity/block-tools): for unicode * fix(@sanity/block-tools): utf8 characters weren't beign filtered. using the vercel/stega * chore: update lock file * (chore): update pnpm lock * chore(deps): dedupe pnpm-lock.yaml (#6508) Co-authored-by: github-merge-queue[bot] <118344674+github-merge-queue[bot]@users.noreply.github.com> * chore(deps): update dependency @sanity/pkg-utils to v6.8.8 (#6509) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> * feat: use prefersLatestPublished parameter in DocumentPaneProvider (#6486) * fix(@sanity): issue where hidden unicode characters were bloating document in PTE (#6440) * fix(portable-text-editor): issue shown in tests re stega. use duplicate code * test(playwright-ct): add test * chore(sanity): remove prettier linting * test(sanity): fix missing snapshot * test(sanity): update test after realising the test would pass always if comparing object number * chore: test unicode removal * chore: test unicode removal * chore(@sanity): remove old solution * fix(@sanity/block-tools): unicode issue. remove vercel/stega and move to block-tools * test(@sanity/block-tools): for unicode * fix(@sanity/block-tools): utf8 characters weren't beign filtered. using the vercel/stega * chore: update lock file * (chore): update pnpm lock * chore(deps): dedupe pnpm-lock.yaml (#6508) Co-authored-by: github-merge-queue[bot] <118344674+github-merge-queue[bot]@users.noreply.github.com> * chore(deps): update dependency @sanity/pkg-utils to v6.8.8 (#6509) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> * fix(pte): simplifying activeAnnotations logic * fix(pte): new isAnnotationActive static method * fix(pte): retoring activeAnnotations method in editor * fix(pte): retoring activeAnnotations method in editor * fix(pte): fixing issue with multiple annotations in a single block * fix(pte): fixing issue with multiple annotations in a single block * fix(pte): fixing typing issue with PortableTextSpan * fix(pte): fixing failing test since mark toggling has changed * fix(pte): improving usage of isTextBlock for createWithPortableTextLists * fix(portable-text-editor): fix issue where decoration would not target correctly (#6532) * fix(pte): remove unused function in createWithPortableTextMarkModel * exploration * fix(pte): reverting incorrect merge * fix(pte): testing new logic for tools in PTE * fix(pte): reorg test cases --------- Co-authored-by: Nina Andal Aarvik <nina@sanity.io> Co-authored-by: RitaDias <anarita151@gmail.com> Co-authored-by: RitaDias <rita@sanity.io> Co-authored-by: Per-Kristian Nordnes <per.kristian.nordnes@gmail.com> Co-authored-by: ecospark[bot] <128108030+ecospark[bot]@users.noreply.github.com> Co-authored-by: github-merge-queue[bot] <118344674+github-merge-queue[bot]@users.noreply.github.com> Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: cngonzalez <carolina.nicole.gonzalez@gmail.com>

* fix(core): set scroll boundary to nearest * fix(core): add smooth scroll behavior * fix(sanity): remove smooth behavior --------- Co-authored-by: RitaDias <anarita151@gmail.com>

ninaandal requested review from skogsmaskin and hermanwikner April 10, 2024 12:39

ninaandal requested a review from a team as a code owner April 10, 2024 12:39

hermanwikner reviewed Apr 10, 2024

View reviewed changes

packages/sanity/src/core/form/inputs/PortableText/hooks/useScrollSelectionIntoView.tsx Show resolved Hide resolved

vercel bot deployed to Preview – performance-studio April 11, 2024 10:44 View deployment

vercel bot deployed to Preview – test-studio April 11, 2024 10:44 View deployment

ninaandal mentioned this pull request Apr 11, 2024

fix(core): change scrollIntoView block to be nearest #6328

Merged

skogsmaskin approved these changes Apr 17, 2024

View reviewed changes

skogsmaskin self-requested a review April 17, 2024 14:06

skogsmaskin requested changes Apr 17, 2024

View reviewed changes

RitaDias self-assigned this Apr 25, 2024

vercel bot deployed to Preview – test-studio April 26, 2024 06:28 View deployment

vercel bot deployed to Preview – performance-studio April 26, 2024 06:30 View deployment

vercel bot had a problem deploying to Preview – test-next-studio April 26, 2024 06:31 Failure

RitaDias requested review from skogsmaskin and hermanwikner April 26, 2024 06:35

vercel bot deployed to Preview – performance-studio April 26, 2024 06:38 View deployment

vercel bot had a problem deploying to Preview – test-next-studio April 26, 2024 06:38 Failure

vercel bot deployed to Preview – test-studio April 26, 2024 06:39 View deployment

rexxars force-pushed the next branch from e594f5e to 61daf0c Compare April 26, 2024 23:33

ninaandal requested review from a team as code owners April 26, 2024 23:33

ninaandal requested review from ricokahler and removed request for a team April 26, 2024 23:33

fix(core): set scroll boundary to nearest

4e85cd9

ninaandal and others added 2 commits April 29, 2024 11:39

fix(core): add smooth scroll behavior

3f73824

fix(sanity): remove smooth behavior

772e4c7

skogsmaskin force-pushed the edx-1080 branch from 65af960 to 772e4c7 Compare April 29, 2024 09:40

skogsmaskin approved these changes Apr 29, 2024

View reviewed changes

vercel bot deployed to Preview – performance-studio April 29, 2024 09:43 View deployment

vercel bot deployed to Preview – test-studio April 29, 2024 09:43 View deployment

vercel bot deployed to Preview – test-next-studio April 29, 2024 09:44 View deployment

ninaandal added this pull request to the merge queue Apr 29, 2024

Merged via the queue into next with commit 0dae0da Apr 29, 2024
39 checks passed

ninaandal deleted the edx-1080 branch April 29, 2024 10:41

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix(core): set scroll boundary to nearest #6310

fix(core): set scroll boundary to nearest #6310

ninaandal commented Apr 10, 2024 •

edited

vercel bot commented Apr 10, 2024 •

edited

github-actions bot commented Apr 10, 2024

github-actions bot commented Apr 10, 2024 •

edited

skogsmaskin commented Apr 17, 2024

skogsmaskin left a comment

skogsmaskin left a comment •

edited

RitaDias commented Apr 26, 2024

skogsmaskin commented Apr 29, 2024

skogsmaskin left a comment

fix(core): set scroll boundary to nearest #6310

fix(core): set scroll boundary to nearest #6310

Conversation

ninaandal commented Apr 10, 2024 • edited

Description

What to review

Testing

Notes for release

vercel bot commented Apr 10, 2024 • edited

github-actions bot commented Apr 10, 2024

github-actions bot commented Apr 10, 2024 • edited

skogsmaskin commented Apr 17, 2024

skogsmaskin left a comment

Choose a reason for hiding this comment

skogsmaskin left a comment • edited

Choose a reason for hiding this comment

RitaDias commented Apr 26, 2024

skogsmaskin commented Apr 29, 2024

skogsmaskin left a comment

Choose a reason for hiding this comment

ninaandal commented Apr 10, 2024 •

edited

vercel bot commented Apr 10, 2024 •

edited

github-actions bot commented Apr 10, 2024 •

edited

skogsmaskin left a comment •

edited