brownplt / code.pyret.org

Website for serving Pyret to folks.
Other
24 stars 45 forks source link

Fix #387, unwanted spacing of multi-line REPL inputs #389

Closed asolove closed 3 years ago

asolove commented 3 years ago

This PR fixes the issue reported in #387.

😭 Sigh. I spent several hours on this and typed up an elaborate essay on why it was happening. There was a cool bit about some mathematical sleuthing (an arithmetic sequence of -11 + 16n extra pixels of padding per line of REPL input!), using a little-known Chrome DevTools feature (you can set JS breakpoints to occur whenever a node's style attribute is changed to see what code does it!), and a lecture about the merits of various ways to measure DOM nodes in various CSS contexts.

But the right fix is the one in this PR, that just turns off an unused plugin that was responsible for all of that nonsense. The "scrollpastend" plugin is useful for CodeMirror instances that have a fixed height and should be scrollable inside the height, like the CPO definitions area. But the plugin was also turned on for the REPL input, where it isn't wanted, because we want the repl CodeMirror instance to expand in height automatically and then scroll within the scope of the broader repl history. Doing auto-expansion plus trying to add extra room to scroll within a (non-existent) fixed container caused all this unwanted extra space to be added.

schanzer commented 3 years ago

(you can set JS breakpoints to occur whenever a node's style attribute is changed to see what code does it!),

image

asolove commented 3 years ago

Info here: https://developer.chrome.com/docs/devtools/javascript/breakpoints/

On Tue, Aug 3, 2021 at 8:35 PM Emmanuel Schanzer @.***> wrote:

(you can set JS breakpoints to occur whenever a node's style attribute is changed to see what code does it!),

[image: image] https://user-images.githubusercontent.com/77126/128103394-1724415c-e4a0-43f2-9c76-5b8f956a5bfa.png

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/brownplt/code.pyret.org/pull/389#issuecomment-892265502, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAACCL3SJPAFOZ7KASNUCGTT3CDMJANCNFSM5BPYDRGQ . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&utm_campaign=notification-email .

jpolitz commented 3 years ago

I mean... I think the essay has an audience, so this is a win-win.