[Bug Report] a bug with "SELECT" component - need to click twice to chose a option on safari with iOS13 #17716

junixy · 2019-10-15T03:17:25Z

Element UI version

2.12.0

OS/Browsers version

safari 13 on iOS13

Vue version

2.6.10

Reproduction Link

https://jsfiddle.net/mmx38qxw/

Steps to reproduce

(1) open the page with on safari 13 with iOS 13,
(2) click the SELECT component and try to chose an option, but it need to click twice and then it can chose the option.

What is Expected?

it should just click once to chose the option.

What is actually happening?

click the SELECT component and try to chose an option, but it need to click twice and then it can chose the option.

acgotakuatdji · 2019-10-18T08:35:13Z

Your demo only have input component.

acgotakuatdji · 2019-10-21T08:52:10Z

add scss code:

.el-scrollbar {
  > .el-scrollbar__bar {
    opacity: 1;
  }
}

can resolve it.

my9074 · 2019-11-19T10:38:47Z

@acgotakuatdji It's worked~ but i don't know what is the cause of this problem ? Can you explain ?

acgotakuatdji · 2019-11-20T00:52:25Z

@my9074 https://run.iviewui.com/v8lHkSrE

This is the test demo. Just click Content area. And check console log.

You will get the answer.

AntonMoskalchenko · 2020-02-17T14:24:42Z

Still have this problem on ^2.13.0

NaturalDevCR · 2020-05-08T16:32:16Z

add scss code:
.el-scrollbar {
  > .el-scrollbar__bar {
    opacity: 1;
  }
}
can resolve it.

Where should i place this? i tried right on a component where i was using select but it didn't work
thanks in advance

ramkrishnakuldeep · 2020-05-12T03:42:37Z

add scss code:
.el-scrollbar {
  > .el-scrollbar__bar {
    opacity: 1;
  }
}
can resolve it.

@my9074 https://run.iviewui.com/v8lHkSrE

This is the test demo. Just click Content area. And check console log.

You will get the answer.

Could you elaborate what you trying to say

mankutila · 2020-07-21T22:53:06Z

Adding styles didn't do the trick. How to overcome the issue?

yubaoquan · 2020-07-24T07:51:42Z

Will this bug be fixed this year?

ndphuong · 2020-08-16T19:56:39Z

.el-scrollbar__bar {
    opacity: 1!important;
}

add this to index.scss

Soumns777 · 2022-03-22T09:20:39Z

I've added this line of code, but ios still needs two clicks to respond

Soumns777 · 2022-03-22T09:24:39Z

@acgotakuatdji Is there any other solution to ios compatible EL-Select?

Idji · 2022-08-03T08:31:06Z

@acgotakuatdji i can't see there any answer and the problem is still here v2.15.6
So, can anyone explane why this bug is appear?

DarknessChaser · 2023-12-28T15:24:21Z

This may not be an element but a Safari bug.
When there is code.

<style>
.main:hover .test {
      opacity: 1;
      /*transition: opacity 2s;*/
    }

    .test {
      opacity: 0;
    }
</style>
<body>
<main class="main">
<!--  <div onmouseenter="this.classList.add('hover');" onclick="this.innerHTML +='click'" class="item">4</div>-->
  <div onclick="this.innerHTML +='click'" class="item">4</div>
  <div onmousedown="function f() {

  }" class="test">test 23 baidu.com</div>
</main>
</body>

The same problem can be reproduced in mobile Safari

WDJ-webDeveloper · 2024-02-28T07:56:41Z

so!who can tell me why happen this

WDJ-webDeveloper · 2024-02-28T07:57:40Z

I want to know reason

ZhelinCheng mentioned this issue Oct 24, 2019

Click twice under [bug report] IOS 13.1.3 to trigger the selected event #17794

Closed

NateScarlet mentioned this issue Dec 19, 2019

[Bug Report] el-select has a drop-down on the ios mobile terminal and the value cannot be selected #18464

Closed

NateScarlet mentioned this issue Jan 13, 2020

[Bug Report] el-select require two tap to change selection since IOS 13.2.3 #18584

Closed

melishev mentioned this issue Mar 19, 2024

Scrollbar: fix double tap bug in iOS Safari #22829

Open

3 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Bug Report] a bug with "SELECT" component - need to click twice to chose a option on safari with iOS13 #17716

[Bug Report] a bug with "SELECT" component - need to click twice to chose a option on safari with iOS13 #17716

junixy commented Oct 15, 2019

acgotakuatdji commented Oct 18, 2019 •

edited

acgotakuatdji commented Oct 21, 2019

my9074 commented Nov 19, 2019

acgotakuatdji commented Nov 20, 2019

AntonMoskalchenko commented Feb 17, 2020

NaturalDevCR commented May 8, 2020

ramkrishnakuldeep commented May 12, 2020

mankutila commented Jul 21, 2020

yubaoquan commented Jul 24, 2020

ndphuong commented Aug 16, 2020 •

edited

Soumns777 commented Mar 22, 2022

Soumns777 commented Mar 22, 2022

Idji commented Aug 3, 2022

DarknessChaser commented Dec 28, 2023 •

edited

WDJ-webDeveloper commented Feb 28, 2024

WDJ-webDeveloper commented Feb 28, 2024

[Bug Report] a bug with "SELECT" component - need to click twice to chose a option on safari with iOS13 #17716

[Bug Report] a bug with "SELECT" component - need to click twice to chose a option on safari with iOS13 #17716

Comments

junixy commented Oct 15, 2019

Element UI version

OS/Browsers version

Vue version

Reproduction Link

Steps to reproduce

What is Expected?

What is actually happening?

acgotakuatdji commented Oct 18, 2019 • edited

acgotakuatdji commented Oct 21, 2019

my9074 commented Nov 19, 2019

acgotakuatdji commented Nov 20, 2019

AntonMoskalchenko commented Feb 17, 2020

NaturalDevCR commented May 8, 2020

ramkrishnakuldeep commented May 12, 2020

mankutila commented Jul 21, 2020

yubaoquan commented Jul 24, 2020

ndphuong commented Aug 16, 2020 • edited

Soumns777 commented Mar 22, 2022

Soumns777 commented Mar 22, 2022

Idji commented Aug 3, 2022

DarknessChaser commented Dec 28, 2023 • edited

WDJ-webDeveloper commented Feb 28, 2024

WDJ-webDeveloper commented Feb 28, 2024

acgotakuatdji commented Oct 18, 2019 •

edited

ndphuong commented Aug 16, 2020 •

edited

DarknessChaser commented Dec 28, 2023 •

edited