AUTOMATIC1111 / stable-diffusion-webui

Stable Diffusion web UI
GNU Affero General Public License v3.0
141.75k stars 26.77k forks source link

[Bug]: Mouse scroll wheel accidentally modifies parameter values when scrolling the UI page #13442

Open wbzy00 opened 1 year ago

wbzy00 commented 1 year ago

Is there an existing issue for this?

What happened?

I'm using Chrome on Windows 10. When putting the blinking mouse cursor "I" (i.e. the input indicator) in a parameter field, and then scroll up or down, the parameter value changes as the UI page is getting scrolled up or down. This bug doesn't not affect users who prefer to use mouse clicking to start Generating, but it affect users who prefer Ctrl + Enter, because the blinking mouse cursor will still be actve in the parameter field when pressing Ctrl + Enter, and would disappear when clicking Generate instead. As a user who prefers to use Ctrl + Enter, I encounter this bug multiple times a day, which is very annoying. I have to be very careful not to let the moue cursor pass any parameter fields when scrolling the UI page up/down in case some parameters get modified accidentally. PS: This bug also affects numerical fields in the Setting page. If a setting got modified unintentionally, that can be quite impactful.

Steps to reproduce the problem

  1. Click any numerical parameter field, such as the Width.
  2. Keep the mouse cursor in the parameter field, and then scroll mouse wheel.
  3. You will see the parameter value changes while the UI page is getting scrolled.

What should have happened?

When the blinking mouse cursor "I" is in a parameter field, the UI page should not move up/down when the user is scrolling up/down the mouse wheel.

Sysinfo

sysinfo-2023-09-30-02-01.txt

What browsers do you use to access the UI ?

Google Chrome

Console logs

venv "E:\stable-diffusion-webui\venv\Scripts\Python.exe"
Python 3.10.6 (tags/v3.10.6:9c7b4bd, Aug  1 2022, 21:53:49) [MSC v.1932 64 bit (AMD64)]
Version: v1.6.0
Commit hash: 5ef669de080814067961f28357256e8fe27544f4
You are up to date with the most recent release.
Launching Web UI with arguments: --xformers --update-check --ad-no-huggingface --medvram-sdxl
Civitai Helper: Get Custom Model Folder
Civitai Helper: Load setting from: E:\stable-diffusion-webui\extensions\Stable-Diffusion-Webui-Civitai-Helper\setting.json
Civitai Helper: No setting file, use default
Tag Autocomplete: Could not locate model-keyword extension, Lora trigger word completion will be limited to those added through the extra networks menu.
[-] ADetailer initialized. version: 23.9.2, num models: 11
2023-09-30 10:00:19,113 - ControlNet - INFO - ControlNet v1.1.410
ControlNet preprocessor location: E:\stable-diffusion-webui\extensions\sd-webui-controlnet\annotator\downloads
2023-09-30 10:00:19,440 - ControlNet - INFO - ControlNet v1.1.410
sd-webui-prompt-all-in-one background API service started successfully.
Loading weights [fc2511737a] from E:\stable-diffusion-webui\models\Stable-diffusion\chilloutmix_NiPrunedFp32Fix.safetensors
Creating model from config: E:\stable-diffusion-webui\configs\v1-inference.yaml
E:\stable-diffusion-webui\extensions\sdweb-easy-prompt-selector\scripts\easy_prompt_selector.py:97: GradioDeprecationWarning: The `style` method is deprecated. Please set these arguments in the constructor instead.
  reload_button.style(size='sm')
E:\stable-diffusion-webui\extensions\stable-diffusion-webui-sonar\scripts\sonar.py:658: GradioDeprecationWarning: The `style` method is deprecated. Please set these arguments in the constructor instead.
  with gr.Row(variant='compact').style(equal_height=True):
E:\stable-diffusion-webui\extensions\sd-extension-system-info\scripts\system-info.py:451: GradioDeprecationWarning: The `style` method is deprecated. Please set these arguments in the constructor instead.
  refresh_quick_btn = gr.Button('Refresh state', elem_id = 'system_info_tab_refresh_btn', visible = False).style() # quick refresh is used from js interval
E:\stable-diffusion-webui\extensions\sd-extension-system-info\scripts\system-info.py:452: GradioDeprecationWarning: The `style` method is deprecated. Please set these arguments in the constructor instead.
  refresh_full_btn = gr.Button('Refresh data', elem_id = 'system_info_tab_refresh_full_btn', variant='primary').style()
E:\stable-diffusion-webui\extensions\sd-extension-system-info\scripts\system-info.py:504: GradioDeprecationWarning: The `style` method is deprecated. Please set these arguments in the constructor instead.
  bench_run_btn = gr.Button('Run benchmark', elem_id = 'system_info_tab_benchmark_btn', variant='primary').style()
E:\stable-diffusion-webui\extensions\sd-extension-system-info\scripts\system-info.py:506: GradioDeprecationWarning: The `style` method is deprecated. Please set these arguments in the constructor instead.
  bench_submit_btn = gr.Button('Submit results', elem_id = 'system_info_tab_submit_btn', variant='primary').style()
E:\stable-diffusion-webui\extensions\sd-extension-system-info\scripts\system-info.py:515: GradioDeprecationWarning: The `style` method is deprecated. Please set these arguments in the constructor instead.
  refresh_bench_btn = gr.Button('Refresh bench', elem_id = 'system_info_tab_refresh_bench_btn', visible = False).style(full_width = False) # quick refresh is used from js interval
E:\stable-diffusion-webui\extensions\sd-extension-system-info\scripts\system-info.py:515: GradioDeprecationWarning: Use `scale` in place of full_width in the constructor. scale=1 will make the button expand, whereas 0 will not.
  refresh_bench_btn = gr.Button('Refresh bench', elem_id = 'system_info_tab_refresh_bench_btn', visible = False).style(full_width = False) # quick refresh is used from js interval
Running on local URL:  http://127.0.0.1:7860

To create a public link, set `share=True` in `launch()`.
Startup time: 36.5s (prepare environment: 14.2s, import torch: 4.2s, import gradio: 2.9s, setup paths: 1.3s, initialize shared: 0.3s, other imports: 1.6s, setup codeformer: 0.2s, list SD models: 0.2s, load scripts: 4.5s, create ui: 1.5s, gradio launch: 2.8s, app_started_callback: 3.0s).
Applying attention optimization: xformers... done.
Model loaded in 18.6s (load weights from disk: 0.4s, create model: 1.4s, apply weights to model: 10.3s, apply half(): 2.7s, load VAE: 0.3s, load textual inversion embeddings: 0.1s, calculate empty prompt: 3.3s).

Additional Information

My default value of Clip Skip was accidentally changed to from 1 to 2 because of this bug.

missionfloyd commented 1 year ago

I can reproduce this in edge and firefox, but not chrome.

What happens if you move or delete javascript/imageviewerGamepad.js and reload the page?

wbzy00 commented 1 year ago

I can reproduce this in edge and firefox, but not chrome.

What happens if you move or delete javascript/imageviewerGamepad.js and reload the page?

When I rename the js file and re-launch the console, the bug is gone. When I restore the filename and re-launch the console, the bug is back. This is tested on Chrome.

missionfloyd commented 1 year ago

I think this is a bug (or something) in chromium. imageviewerGamepad.js doesn't do anything that should affect inputs, and even an empty listener does it. https://jsfiddle.net/k139cnhj/

It's the default behavior in firefox (and does it right; it doesn't scroll the page).

Some people might actually want it to do that, but this effectively disables it. Put it in a new js file.

document.addEventListener("wheel", function() {
    if (document.activeElement.type === "number") {
        document.activeElement.blur();
    }
});
wbzy00 commented 1 year ago

@missionfloyd It worked. Will this bug get fixed in a future release?