pnp / pnp/sp-dev-fx-controls-react

Out of the box "sticky" is broken by several of the components

Open
#2,120 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
433
Forks
418
Avg merge
5d 6m
Merged PRs (30d)
19

Description

Category

[ ] Enhancement

[X ] Bug

[ ] Question

Version

Please specify what version of the library you are using: [ 3.24.0 and 3.23 of @pnp/spfx-property-controls ]

Expected / Desired Behavior / Question

Components should not interfere with Microsoft out of the box webparts

Observed Behavior

When a custom webpart using either and\or a @pnp/spfx-property-controls component (I will report to that repo as well) the result is the same - the microsoft "text" webpart's toolbar menu stops being "sticky" as you scroll down the page - forcing the user to scroll to the top of the webpart to use the editing menu.
This happens even if the filepicker is in the property pane of the custom webpart.

Steps to Reproduce
  1. create a custom webpart, with a custom property pane, and add a filepicker to it.
    2, add the webpart to a page, and on the same page add a text webpart and write a lot of rows in it so that to see the bottom of it you have to scroll down the page
  2. put cursor at the bottom of text webpart - note how the menubar (toolbar) for editing the text is not showing, unless you scroll back to top of the webpart.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the issue with a custom webpart using a filepicker in its property pane, alongside a Microsoft text webpart containing enough content to require scrolling. Compare the text webpart toolbar behavior with and without the custom component. Done means the toolbar remains sticky while the filepicker or other property-controls component is present.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.