fix: iOS13 scrollViewIndicator adaptation

[billxie1988]

scrollViewIndicator adaptation on iOS 13

On iOS 13 scrollView's new property automaticallyAdjustsScrollIndicatorInsets default value YES which make the webview vertical indicator position in wrong offset

test the webview scrollIndicator below iOS13

Compatibility

OS	Implemented
iOS	✅
Android	❌

Checklist

• I have tested this on a device and a simulator
• I added the documentation in README.md
• I mentioned this change in CHANGELOG.md
• I updated the typed files (TS and Flow)
• I added a sample use of the API in the example project (example/App.js)

[safaiyeh]

@billxie1988 How can I test this out so I can see the before/after?

[billxie1988]

@billxie1988 How can I test this out so I can see the before/after?

It always happen on an iOS 13+ iphone. the scene is when you push one h5 has navigationbar hidden to another h5 navigation bar visable , the vertical Indicator's x offset usually postion in the wrong place. automaticallyAdjustsScrollIndicatorInsets default value YES，and I try to set to NO all things works well.And this issue is only happen on ios13+.We didn't find the issue happen on iOS 12 or lower's iphones. Finally I find the new feature of scrollView.automaticallyAdjustsScrollIndicatorInsets on iOS 13

[safaiyeh]

Thanks for the info @billxie1988, what library are you using for navigation? I am going to build a small test project.

[billxie1988]

Thanks for the info @billxie1988, what library are you using for navigation? I am going to build a small test project.

ReactNavigation

[safaiyeh]

Hmm I couldn't reproduce it could you put up an example?

[billxie1988]

Hmm I couldn't reproduce it could you put up an example?

OK I will give an demo to u，later

[billxie1988]

I write the demo couldn't reproduce it , may be anyonther class affect this issue in the main project.FinnalIy I used the category method to deal with it.

[Remigar2012]

Why close pr?

[Remigar2012]

this fix helped me

[billxie1988]

this fix helped me

you have the same issue？I finally use a native category method to set the webview ios 13 new property，beacuse I thought that was not the webview’s problem and the automaticallyAdjustsScrollIndicatorInsets problem may fix in the nearly version on ios 13.If I change the default value may cause anyother problem affect more developer

[billxie1988]

#import "WKWebView+ScrollIndicator.h"
#import <objc/runtime.h>

@implementation WKWebView (ScrollIndicator)
+ (void)load {
        SEL origSel = @selector(initWithFrame:configuration:);
        SEL swizSel = @selector(swiz_initWithFrame:configuration:);
        [WKWebView swizzleMethods:[self class] originalSelector:origSel swizzledSelector:swizSel];
}

+ (void)swizzleMethods:(Class)class originalSelector:(SEL)origSel swizzledSelector:(SEL)swizSel {
   
    Method origMethod = class_getInstanceMethod(class, origSel);
    Method swizMethod = class_getInstanceMethod(class, swizSel);
    BOOL didAddMethod = class_addMethod(class, origSel, method_getImplementation(swizMethod), method_getTypeEncoding(swizMethod));
    if (didAddMethod) {
        class_replaceMethod(class, swizSel, method_getImplementation(origMethod), method_getTypeEncoding(origMethod));
    } else {
        method_exchangeImplementations(origMethod, swizMethod);
    }
}

- (instancetype)swiz_initWithFrame:(CGRect)frame configuration:(WKWebViewConfiguration *)configuration {
    WKWebView *webView =[self swiz_initWithFrame:frame configuration:configuration];
    if (@available(iOS 13.0, *)) {
        webView.scrollView.automaticallyAdjustsScrollIndicatorInsets = NO;
    } 
    return webView;
}

@end


FYI

[billxie1988]

Why close pr?
you can provide a demo to me. I can reopen this pr

[safaiyeh]

Hi @billxie1988 can you checkout the issue I mentioned below Your PR might be more appropriate to add to ScrollView in core.

[billxie1988]

Vertical scrollbar of FlatList not correctly vertically aligned is seems to cause by same problem (the iOS 13 new feature automaticallyAdjustsScrollIndicatorInsets. )We just need to set the default value NO. Can solve it.This issue is verified by my native methed on iOS 13.

[safaiyeh]

Nice since it seems to be a core issue, not just relevant to WebView could you make your changes there?

[billxie1988]

Sure It's a core issue.This PR just give an interface for the RN developer to set the new propety value.
People sometimes want to set webview‘s automaticallyAdjustsScrollIndicatorInsets value.But now there has no place to figure it out

[munafmohammed]

Please release this fix. I am also facing the issue where scroll indicator is coming to the middle of the screen and overlapping on the content.

[billxie1988]

LGTM

[billxie1988]

@safaiyeh , @jamonholmgren there seems to have some network connecting error on CI.

[ghost]

@billxie1988 Why did you close this PR? The problem is still there.

[nmhoan76]

The problem is still there. @billxie1988 please

[ghost]

@jamonholmgren @Titozzz
Please review.
This is a very crucial feature.
Otherwise, the only solution is to hide the vertical scrollbar which is a dirty workaround.

[nmhoan76]

@jamonholmgren @Titozzz
Please review.
This is a very crucial feature.
Otherwise, the only solution is to hide the vertical scrollbar which is a dirty workaround.

Containing the app in SafeAreaView fixed my problem.

[ghost]

Containing the app in SafeAreaView fixed my problem.

SafeAreaView is not a solution but more like a workaround.
There are plenty of scenarios when an application has to use all available room on the screen.

[Titozzz]

iOS 14 is here it's time we release this 😂

[react-native-community-bot]

🎉 This PR is included in version 11.1.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[rafaismyname]

@Titozzz @jamonholmgren @billxie1988

I believe that this PR introduced a breaking bug in iOS <13 (it for sure introduced a breaking bug in iOS 10)

My RN version: 0.63.4
My Simulator versions: iPad Air 10.3 and iPad Air 12
My Stack trace:

[87394:739448] -[WKScrollView setAutomaticallyAdjustsScrollIndicatorInsets:]: unrecognized selector sent to instance 0x7f93d9073600
[87394:739448] [native] Exception thrown while executing UI block: -[WKScrollView setAutomaticallyAdjustsScrollIndicatorInsets:]: unrecognized selector sent to instance 0x7f93d9073600

Rolling back react-native-webview to version 11.0.3 solves the issue

[sdumjahn]

Same problem here with RN 0.63.4 and iOS 12.1.4

[ghost]

Same problem in iOS 12.4

[billxie1988]

@Titozzz @jamonholmgren @billxie1988

I believe that this PR introduced a breaking bug in iOS <13 (it for sure introduced a breaking bug in iOS 10)

My RN version: 0.63.4
My Simulator versions: iPad Air 10.3 and iPad Air 12
My Stack trace:

[87394:739448] -[WKScrollView setAutomaticallyAdjustsScrollIndicatorInsets:]: unrecognized selector sent to instance 0x7f93d9073600
[87394:739448] [native] Exception thrown while executing UI block: -[WKScrollView setAutomaticallyAdjustsScrollIndicatorInsets:]: unrecognized selector sent to instance 0x7f93d9073600

Rolling back react-native-webview to version 11.0.3 solves the issue

Same problem in iOS 12.4

@Titozzz @jamonholmgren @billxie1988

I believe that this PR introduced a breaking bug in iOS <13 (it for sure introduced a breaking bug in iOS 10)

My RN version: 0.63.4
My Simulator versions: iPad Air 10.3 and iPad Air 12
My Stack trace:

[87394:739448] -[WKScrollView setAutomaticallyAdjustsScrollIndicatorInsets:]: unrecognized selector sent to instance 0x7f93d9073600
[87394:739448] [native] Exception thrown while executing UI block: -[WKScrollView setAutomaticallyAdjustsScrollIndicatorInsets:]: unrecognized selector sent to instance 0x7f93d9073600

Rolling back react-native-webview to version 11.0.3 solves the issue

OK I'll fix this ASAP

[Titozzz]

Ping me on the pr and I'll merge

[billxie1988]

@Titozzz #1843