New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Affix doesn't update in iOS UIWebview #16202

Closed
mhemesath opened this Issue Apr 1, 2015 · 16 comments

Comments

Projects
None yet
4 participants
@mhemesath

mhemesath commented Apr 1, 2015

In UIWebview scroll events aren't fired. This has the effect of making affix look buggy as its position isnd't updated until after scroll is done. To mitigate the effects of this, we could add a touchmove event listener to update the affix position when the user is scrolling via moving their finger.

    this.$target = $(this.options.target)
      .on('scroll.bs.affix.data-api', $.proxy(this.checkPosition, this))
      .on('touchmove.bs.affix.data-api', $.proxy(this.checkPosition, this))
      .on('click.bs.affix.data-api',  $.proxy(this.checkPositionWithEventLoop, this))

@cvrebert cvrebert changed the title from Affix doesn't update in uiwebview to Affix doesn't update in iOS UIWebview Apr 1, 2015

@cvrebert cvrebert added the js label Apr 1, 2015

@cvrebert

This comment has been minimized.

Member

cvrebert commented Apr 1, 2015

What version of iOS are you using?

@mhemesath

This comment has been minimized.

mhemesath commented Apr 1, 2015

iOS 8.2. You can reproduce the issue in Chrome for iOS

@cvrebert

This comment has been minimized.

Member

cvrebert commented Apr 1, 2015

@mhemesath

This comment has been minimized.

mhemesath commented Apr 2, 2015

That doesn't solve the issue. The view can scroll, it just doesn't fire any scroll events while it is going. This causes the affix to not "stick" until after scroll ends.

@cvrebert

This comment has been minimized.

Member

cvrebert commented Apr 4, 2015

Does WKWebView suffer from the same problem?

@mhemesath

This comment has been minimized.

mhemesath commented Apr 6, 2015

No, I haven't tested it but from what I've read the WKWebview is similar to the native Safari in iOS 8.X and will throw scroll events while scrolling. This is only a a problem for UIWebview in iOS.

@cvrebert cvrebert added the browser bug label Apr 6, 2015

@cvrebert

This comment has been minimized.

@cvrebert

This comment has been minimized.

Member

cvrebert commented Apr 21, 2015

@mhemesath Have you gotten a chance to try the other workaround I linked to above?

@mhemesath

This comment has been minimized.

mhemesath commented Apr 22, 2015

Sorry, that didn't seem to work either. We are getting scroll events, just not until after scroll is over. I can try to throw together a test page that should be reproducible with Chrome on iOS (which uses webview I think).

@cvrebert

This comment has been minimized.

Member

cvrebert commented Apr 22, 2015

Can you post what the UIWebview uses as its user agent string?

For comparison:

  • iOS 8.3 Safari
    • Mozilla/5.0 (iPhone; CPU iPhone OS 8_3 like Mac OS X) AppleWebKit/600.1.4 (KHTML, like Gecko) Version/8.0 Mobile/12F70 Safari/600.1.4
  • OS X Safari 8.0.5
    • Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_3) AppleWebKit/600.5.17 (KHTML, like Gecko) Version/8.0.5 Safari/600.5.17
@mhemesath

This comment has been minimized.

mhemesath commented Apr 22, 2015

Mozilla/5.0 (iPhone; CPU iPhone OS 10_10_2 like Mac OS X) AppleWebKit/600.1.4 (KHTML, like Gecko) Mobile/12D508

@cvrebert

This comment has been minimized.

Member

cvrebert commented May 3, 2015

So, my research didn't turn up any way to differentiate between UIWebView vs. WKWebView via JS.
UIWebView can be distinguished from Safari by looking for the "Version/" token in the user agent, which is present in Safari but absent in both types of webview.

@fat What are your thoughts here, given the possible performance penalty of a touch event handler?

@fat

This comment has been minimized.

Member

fat commented May 4, 2015

I'm inclined not to add this directly into the plugin. Mobile scroll stuff has always been kinda jank and I'm a bit worried about potential sideeffects of adding the touchmove for all cases.

Also, i feel better about passing on this because it seems like there are a couple of straightforward ways to get this behavior in your app – you could subclass Affix pretty simply or just write a quick little script to pipe touchevents through for your specific target/instance.

@fat fat closed this May 4, 2015

@cvrebert

This comment has been minimized.

Member

cvrebert commented May 29, 2015

@Shasharoman

This comment has been minimized.

Shasharoman commented Mar 15, 2017

try use touchstart event on element and do nothing, but scroll events aren't fired when fingers leave the screen.

@cvrebert

This comment has been minimized.

Member

cvrebert commented Mar 15, 2017

Affix is no longer officially supported; see https://v4-alpha.getbootstrap.com/migration/#components

@twbs twbs locked and limited conversation to collaborators Mar 15, 2017

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.