datalist doesn't have a scroll bar

[ws93]

Preflight Checklist

• I have read the Contributing Guidelines for this project.
• I agree to follow the Code of Conduct that this project adheres to.
• I have searched the issue tracker for an issue that matches the one I want to file, without success.

Issue Details

• Electron Version:
  • v5.0.4
• Operating System:
  • Windows 10
• Last Known Working Electron version:
  • Not sure

Expected Behavior

<input list="browsers" id="myBrowser" name="myBrowser" />
<datalist id="browsers">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
  <option value="Microsoft Edge">
</datalist>

The above code will generate a searchable dropdown list. If it has many many options, the list should have a scroll bar. This is easy to see on both chrome or firefox

Actual Behavior

It doesn't have scroll bar and it can only show limited items.

To Reproduce

Clone this project to reproduce.

If you provide a URL, please list the commands required to clone/setup/run your repo e.g.

$ git clone https://github.com/ws93/electron-quick-start.git
$ npm install
$ npm start

Screenshots

Additional Information

[jkash20]

Has this been solved yet? I have the same issue.

[WilliamR312]

I have the same issue too :(

[erickzhao]

I can confirm this still happens to me on macOS on the latest few versions of Electron. I've updated the labels accordingly so that this doesn't get buried.

[zasonnik]

This issue still happens in linux with last stable Electron version

[TejasDharmadhikari]

Facing the Same issue. Need a scrollable data list.

[zarubond]

This is happening on all platforms, on all releases (tested on E17). But if you create input with type "time" it does create scrollbar. The problem is when you try to scroll the list is jumping like crazy and is unuseable. There is probably some problem with mapping position of mouse to the list itself. This started with Electron 11.

You can try this:

<input type="time" list="time_datalist_0" value"11:00" > <datalist id="time_datalist_0"><option value="00:00"></option><option value="00:30"></option><option value="01:00"></option><option value="01:30"></option><option value="02:00"></option><option value="02:30"></option><option value="03:00"></option><option value="03:30"></option><option value="04:00"></option><option value="04:30"></option><option value="05:00"></option><option value="05:30"></option><option value="06:00"></option><option value="06:30"></option><option value="07:00"></option><option value="07:30"></option><option value="08:00"></option><option value="08:30"></option><option value="09:00"></option><option value="09:30"></option><option value="10:00"></option><option value="10:30"></option><option value="11:00"></option><option value="11:30"></option><option value="12:00"></option><option value="12:30"></option><option value="13:00"></option><option value="13:30"></option><option value="14:00"></option><option value="14:30"></option><option value="15:00"></option><option value="15:30"></option><option value="16:00"></option><option value="16:30"></option><option value="17:00"></option><option value="17:30"></option><option value="18:00"></option><option value="18:30"></option><option value="19:00"></option><option value="19:30"></option><option value="20:00"></option><option value="20:30"></option><option value="21:00"></option><option value="21:30"></option><option value="22:00"></option><option value="22:30"></option><option value="23:00"></option><option value="23:30"></option></datalist>

[deermichel]

chromium issue: https://bugs.chromium.org/p/chromium/issues/detail?id=1270173&cursor=chromium%3A1270173&q=datalist

caused by: https://chromium-review.googlesource.com/c/chromium/src/+/2359398

[deermichel]

I followed up upstream, even though the missing scrollbar & scrolling glitches are two separate issues. The latter is 100% a Chromium issue. @erickzhao if you have some spare cycles feel free to poke around with it; or ping me to pair up on this - not a p1 though :)

Workaround with obivous side effects:

app.commandLine.appendSwitch('disable-smooth-scrolling')

[Spider149]

I'm using latest electron forge version (beta.63), electron 17.2.0, windows 10 and this bug still happen

[Inqnuam]

I followed up upstream, even though the missing scrollbar & scrolling glitches are two separate issues. The latter is 100% a Chromium issue. @erickzhao if you have some spare cycles feel free to poke around with it; or ping me to pair up on this - not a p1 though :)

Workaround with obivous side effects:

app.commandLine.appendSwitch('disable-smooth-scrolling')

Tried but unfortunately without success

[github-actions]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. If you have any new additional information—in particular, if this is still reproducible in the latest version of Electron or in the beta—please include it with your comment!

[github-actions]

This issue has been closed due to inactivity, and will not be monitored. If this is a bug and you can reproduce this issue on a supported version of Electron please open a new issue and include instructions for reproducing the issue.