Unable to use registerWhitelistedView() on Android

[craigwduckett]

Platform Both (but testing on Android)

Technology React native

Smartlook SDK version 0.40.0

Summary Getting the below error when trying to white list a component [TypeError: Smartlook.registerWhitelistedView is not a function. (In 'Smartlook.registerWhitelistedView(EVMaterialInputRef)', 'Smartlook.registerWhitelistedView' is undefined)] componentdidcatch undefined

Steps to reproduce [optional] Added ref={(EVMaterialInputRef) => { Smartlook.registerWhitelistedView(EVMaterialInputRef); }} to a TextField component that extends TextField

[adamblack]

Hi @craigwduckett ,

I am little bit confused regarding your example above. Are you trying to call registerWhitelistedView or unregisterBlacklistedView?

In my example app, I tested both versions and it works fine (no errors or lack of functionality):

<WebView
                ref={ (ref) => {
                    Smartlook.registerWhitelistedView(ref);
                    Smartlook.unregisterBlacklistedView(ref);
                  }
                }
                    source={{ uri: 'https://google.com' }}
                    style={{ marginTop: 20 }}
                />

Could you check if Smartlook is i.e. accessible/assigned?

[craigwduckett]

@adamblack whoops sorry that must’ve been confusing. I’ve just fixed it up. I’ll need to test again on Wednesday but in the mean time would you mind providing an example to allow TextField(s).

Also is it possible to allow all blacklisted components and then just select the ones we want obscured?

[craigwduckett]

We are using https://github.com/n4kz/react-native-material-textfield, so I'm adding your code ie

return (
      <View
        style={[
          noMargin ? styles.outerContainerNoMarginStyle : styles.outerContainerStyle,
          outerContainerStyle,
        ]}>
        <OutlinedTextField
          testID={`${testID}TextInput`}
          ref={(EVMaterialInputRef) => {
            Smartlook.registerWhitelistedView(EVMaterialInputRef);
            Smartlook.unregisterBlacklistedView(EVMaterialInputRef);
          }
          }
          secureTextEntry={passwordMasked}
          editable={editable && isInput}
          title={helperText}
          textColor={baseColor}
          activeLineWidth={1}
          placeholderTextColor={colours.Ghost}
          tintColor={colours.ActionBlue}
          baseColor={colours.DarkGrey}
          renderRightAccessory={this.renderRightAccessory}
          onFocus={this.onFocus}
          onBlur={this.onBlur}
          titleTextStyle={styles.titleTextStyle}
          fontSize={fontSize}
          value={textFieldValue}
          label={`${label}${required ? '*' : ''}`}
          formatText={this.formatText}
          onChangeText={this.onChangeText}
          error={error}
          errorColor={colours.ErrorRed}
          onSubmitEditing={onSubmitEditing}
          containerStyle={noMargin ? { marginBottom: -22 } : {}}
          {...otherProps}
        />
        {helperText || error ? <View style={styles.margin} /> : null}
      </View>
    );

along with import Smartlook from 'smartlook-react-native-wrapper'; or const Smartlook = require('smartlook-react-native-wrapper'); but still get this error

UPDATE: If I only use the unregisterBlacklistedView function its fine but as soon as I introduce the whitelised function I get the error.

[craigwduckett]

I have resolved this by running the whitelist function on componentDidMount().