ActionMenu: Page scrolls when moving focus to first item

[siddharthkp]

Steps to reproduce:

1. Open an ActionMenu with click (not keyboard). Focus will stay on the anchor.
2. Press ArrowDown to move focus from anchor to first item

This also fires page scroll event

In docs,

https://user-images.githubusercontent.com/6636360/185539825-0ec1bf4a-e307-4d1a-9c3d-84ee9b117a57.mov

In memex,

https://user-images.githubusercontent.com/1863771/185975424-d5e3bfc0-48ea-436c-b4e4-c24df9f6776c.mov

Impact:

Low, tiny annoyance for users that use both mouse and keyboard in the menu

Solution:

We might need to prevent the scroll event when moving focus for the first time in useMoveFocusToMenuItem

[Shubhambawner]

Hello @siddharthkp @colebemis , may I work on this issue ?

[siddharthkp]

Sure, go for it! :)

[Shubhambawner]

Hello, can you please help me in setting p the project locally? I forked repo, then cloned the fork locally, and then ran the script npm run setup as described in here attaching the screenshot here:

I cleaned the whole repo and re cloned it again, but the same thing repeats, if possible, please provide any setup guidelines for locally setting up the repo.

I am having node v16 as described, npm v8.5.0

[siddharthkp]

Hi!

script/setup is a bash script. You have to make sure the terminal you are using supports bash.

I'm not on windows so I'm not able to recommend you one that's good. microsoft/windows terminal might be a good one?

[Shubhambawner]

I am using terminal that comes integrated with VS Code IDE, I tried windows command prompt, PowerShell and PowerShell as admin.

[siddharthkp]

That's a shame, are you able to run the commands inside the script individually?

# Install dependencies
npm install

# Build
npm run build

# Install docs dependencies
pushd docs
npm install --legacy-peer-deps
popd

[Shubhambawner]

I tried that too at the very beginning, but after running each script manually the start command gives error:

as it seems to be a gatsby error, here is some more info:

[email protected] gatsby gatsby "info"

System: OS: Windows 10 10.0.19043 CPU: (4) x64 Intel(R) Core(TM) i3-10110U CPU @ 2.10GHz Binaries: Node: 16.14.2 - D:\program_files\nodeJS\node.EXE Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD npm: 8.5.0 - D:\program_files\nodeJS\npm.CMD Languages: Python: 3.9.5 - D:\program_files\python\python.EXE Browsers: Edge: Spartan (44.19041.1266.0), Chromium (104.0.1293.63) npmPackages: gatsby: ^3.7.2 => 3.7.2 gatsby-plugin-alias-imports: ^1.0.5 => 1.0.5 gatsby-plugin-typescript: 2.10.0 => 2.10.0

[siddharthkp]

Ah right, same story after installation as well. We haven't tested this on windows at all to know all the breaking points, so I don't know how to help you here 😢

@colebemis any ideas?

[Shubhambawner]

I m really not able to figure out the setup for windows, shall we put it on discussion ? Does the development of all repositories at primer completely happen in Linux/Unix environment ?

[siddharthkp]

I m really not able to figure out the setup for windows, shall we put it on discussion

Yep, good call!

Does the development of all repositories at primer completely happen in Linux/Unix environment ?

It does. I know some folks use codespaces instead of a local clone, that should work for you as well

[Haikyuu77]

hey @siddharthkp, can I work on this issue?

[Shubhambawner]

This issue ceases to exist after some other commits, so I stoped working on it. And yes, if you need to set up locally, I would instead recomend some cloud serviece like codesandbox, as it dosnt work well with windows.

[tallys]

@lesliecdubs is this still in progress somewhere? No one is assigned, but potentially this is in progress from an external contributor. Do you have context?

[lesliecdubs]

@tallys as far as I'm aware, this is one isn't in progress; does it require reprioritization?

If anyone who has commented on this issue is actively working on this, please let us know!

[Shubhambawner]

I had checked this issue after recent commits in around end of 2022, it seemed that issue no longer exists as mentioned above, check it once

[lesliecdubs]

Thanks for weighing in, @Shubhambawner!

@siddharthkp can you please re-test this bug report in production, and close this out if the issue has been resolved?

[radglob]

Just tested this against production. Doesn't seem to be an issue anymore.

https://user-images.githubusercontent.com/1825422/226651950-5a26ea3d-9407-4efd-83d4-0d7c0307a3b0.mov

[lesliecdubs]

Thanks @radglob! I'm going to close this as resolved, but please feel free to comment back if anyone notices this bug again.