question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

List items not clickable on the web

See original GitHub issue

On expo 39 with web build. List can’t not be clickable, it’s looks like blur is called and hide list before called.

Working fine with iOS and Android only issue with web

import * as React from 'react';
import { View, StyleSheet, TextInput } from 'react-native';
import Constants from 'expo-constants';
import { GooglePlacesAutocomplete } from 'react-native-google-places-autocomplete';

const GOOGLE_PLACES_API_KEY = ''; // never save your real api key in a snack!

const App = () => {
  return (
    <View style={styles.container}>
      <GooglePlacesAutocomplete
            placeholder="Search"
            onPress={(data, details = null) => {
                // 'details' is provided when fetchDetails = true
                console.log(data, details);
            }}
            requestUrl={{
                useOnPlatform: "web",
                url:
                    "https://cors-anywhere.herokuapp.com/https://maps.googleapis.com/maps/api",
            }}
            numberOfLines={3}
            query={{
                key: "",
                language: "en",
                components: "country:uk",
            }}
        />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    padding: 10,
    paddingTop: Constants.statusBarHeight + 10,
    backgroundColor: '#ecf0f1',
  },
});

export default App;

Additional context

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "expo": "^39.0.0",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-39.0.3.tar.gz",
    "react-native-web": "~0.13.7",
    "react-native-google-places-autocomplete": "^2.0.2"
  },
  "devDependencies": {
    "babel-preset-expo": "^8.3.0",
    "@babel/core": "^7.8.6"
  },
  "private": true
}
  • iOS
  • Android
  • Web

If you are using expo please indicate here:

  • I am using expo

Add any other context about the problem here, screenshots etc

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:4
  • Comments:19 (6 by maintainers)

github_iconTop GitHub Comments

3reactions
luisbajanacommented, Oct 21, 2020

@ksi9302 thank you Peter, I was having the same issue. iOS and Android.

3reactions
ksi9302commented, Oct 20, 2020

Hi, just wondering if there’s a work around at the moment before the update?

For anyone wanting a quick fix for web, just comment the line 895 ~ 902.

onBlur={ onBlur ? () => { this._onBlur(); onBlur(); } : this._onBlur }

Read more comments on GitHub >

github_iconTop Results From Across the Web

List Items not clickable. Can't view items
In SharePoint online list view, when you (single) click on SharePoint default Title column, it opens list form. Possible Solutions:.
Read more >
Prevent click on certain elements - javascript - Stack Overflow
So, if I put like "mysite.com" in item-site div and hover over item output is www.mysite.com and that is ok if item-site is...
Read more >
Making menu items not clickable - WildApricot Help
To make a single menu item not clickable, follow these steps: Go to the Website module (by clicking the Website menu) then click...
Read more >
SPO List view where users cannot click the list item but only ...
not sure is there standard way to do that but you may try to debug javascript code on the list view, identify event...
Read more >
How To Deal With "Element is not clickable at point” Exception ...
WebElement to be clicked is disabled. · WebElement is not yet available (or loaded) on the web page. · WebElements overlap with each...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found