Unity WebGL - HTML Mouse Inputs Broken (Input type=Range,Number, etc)

Unity 5.4

Building a Unity WebGL application (not a game) that handles all 3D content on the Unity side of things, and all the UI is built using HTML/CSS/JS. By default, WebGLInput.captureAllKeyboardInput is set to true, which causes any input fields that require keyboard (text) input to be broken, as any keyboard controls are automatically being eaten up by Unity rather than going to the input field. Doing

#if !UNITY_EDITOR && UNITY_WEBGL WebGLInput.captureAllKeyboardInput = false; #endif

fixes the issue with input fields, but causes unity to ignore ALL keyboard inputs, even after the element is focused, however adding

tabindex="1"

to the fixes it so that keyboard input on HTML input fields works when focused, and keyboard controls inside the Unity WebGL app works when focused as well. (this is all per the docs: https://docs.unity3d.com/ScriptReference/WebGLInput-captureAllKeyboardInput.html). So that's all working fine.

However, the Unity WebGL application is still causing issues with some input fields using MOUSE (not keyboard) controls. Namely I've noticed it on input type="range" fields (HTML5 sliders) and input type="number (using keyboard to type in numbers works, but mouse clicking up and down do not).

Is there any sort of workaround to fix this? I essentially need to prevent the Unity WebGL canvas to not automatically take all mouse inputs, unless the element is clicked/focused first (just like the way the keyboard controls work). Anything to change on the Unity side to fix this? Or do I need to write some custom JavaScript to handle all input and determine whether it's intended for the Unity scene or the HTML UI?