Fit.UI icon indicating copy to clipboard operation
Fit.UI copied to clipboard

Dialog: Draggable + MaximumHeight = auto scrolls to top on click

Open Jemt opened this issue 1 year ago • 1 comments

See https://jsfiddle.net/Ltku859n/1/ Example also attached at the bottom of this report. Scroll down the content and click somewhere within the dialog. Observe how the content is scrolled back to the top.

Draggable(true) results in z-index being updated when clicking anywhere in the dialog, because it enables automatic "Bring to front". This DOM update (z-index being updated) triggers a mutation observer which in turn calls setContentHeight:

image

The call to setContentHeight resets the height which causes the scroll position to be reset, when the dialog does not have a known/fixed height:

image

Possible solution: Save scroll position before resetting height, and restore it once new height has been calculated and assigned.

Code to reproduce problem:

window.dia = new Fit.Controls.Dialog();
dia.Title("Testing 1-2-3");
dia.Width(400);
dia.MaximumHeight(50, "%");
dia.Draggable(true);
dia.Modal(true);
dia.Content("Steven Paul Jobs (February 24, 1955 – October 5, 2011) was an American businessman, inventor, and investor best known for co-founding the technology giant Apple Inc. Jobs was also the founder of NeXT and chairman and majority shareholder of Pixar. He was a pioneer of the personal computer revolution of the 1970s and 1980s, along with his early business partner and fellow Apple co-founder Steve Wozniak. Steven Paul Jobs (February 24, 1955 – October 5, 2011) was an American businessman, inventor, and investor best known for co-founding the technology giant Apple Inc. Jobs was also the founder of NeXT and chairman and majority shareholder of Pixar. He was a pioneer of the personal computer revolution of the 1970s and 1980s, along with his early business partner and fellow Apple co-founder Steve Wozniak. Steven Paul Jobs (February 24, 1955 – October 5, 2011) was an American businessman, inventor, and investor best known for co-founding the technology giant Apple Inc. Jobs was also the founder of NeXT and chairman and majority shareholder of Pixar. He was a pioneer of the personal computer revolution of the 1970s and 1980s, along with his early business partner and fellow Apple co-founder Steve Wozniak. Steven Paul Jobs (February 24, 1955 – October 5, 2011) was an American businessman, inventor, and investor best known for co-founding the technology giant Apple Inc. Jobs was also the founder of NeXT and chairman and majority shareholder of Pixar. He was a pioneer of the personal computer revolution of the 1970s and 1980s, along with his early business partner and fellow Apple co-founder Steve Wozniak. Steven Paul Jobs (February 24, 1955 – October 5, 2011) was an American businessman, inventor, and investor best known for co-founding the technology giant Apple Inc. Jobs was also the founder of NeXT and chairman and majority shareholder of Pixar. He was a pioneer of the personal computer revolution of the 1970s and 1980s, along with his early business partner and fellow Apple co-founder Steve Wozniak.")
dia.Open();

Jemt avatar Jan 20 '24 10:01 Jemt

Actually, removing/disabling dia.MaximumHeight(50, "%");, and scrolling all the way to the bottom, also causes scroll to slightly change, when clicking somewhere in the dialog. But this too should be fixed if we save and restore the scroll position before and after updating the height in setContentHeight.

Jemt avatar Jan 20 '24 10:01 Jemt