Skip to content
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

Android WebView don't apply CSS filter properly. #20979

Closed
2 tasks done
kevinNejad opened this issue Sep 5, 2018 · 2 comments
Closed
2 tasks done

Android WebView don't apply CSS filter properly. #20979

kevinNejad opened this issue Sep 5, 2018 · 2 comments
Labels
Component: WebView Related to the WebView component. Platform: Android Android applications. Platform: Linux Building on Linux. Resolution: Locked This issue was locked by the bot.

Comments

@kevinNejad
Copy link

kevinNejad commented Sep 5, 2018

React Native Environment Info:
System:
OS: Linux 4.15 Ubuntu 18.04.1 LTS (Bionic Beaver)
CPU: x64 Intel(R) Core(TM) i7-8550U CPU @ 1.80GHz
Memory: 322.83 MB / 15.39 GB
Shell: 4.4.19 - /bin/bash
Binaries:
Node: 8.11.4 - /usr/bin/node
Yarn: 1.9.4 - /usr/bin/yarn
npm: 5.6.0 - /usr/bin/npm
Watchman: 4.7.0 - /usr/local/bin/watchman
npmPackages:
react: 16.4.1 => 16.4.1
react-native: 0.56.0 => 0.56.0
npmGlobalPackages:
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7

setFilter: function (cb, filter) {
      let filterValue = 'invert(0%)';
      if (filter === 'foo') {
        filterValue = 'brightness(0.8) sepia(0.9)';
      } else if (filter === 'bar') {
        filterValue = 'invert(80%)';
      } 

Filters applies to iOS perfectly but on android only applies to images and the rest of the page gets blurry.

@react-native-bot react-native-bot added Platform: Android Android applications. Component: WebView Related to the WebView component. Platform: Linux Building on Linux. labels Sep 5, 2018
@react-native-bot
Copy link
Collaborator

It looks like you are using an older version of React Native. Please update to the latest release, v0.56 and verify if the issue still exists.

The ":rewind:Old Version" label will be removed automatically once you edit your original post with the results of running react-native info on a project using the latest release.

@Titozzz
Copy link
Collaborator

Titozzz commented Sep 10, 2018

Migrated to react-native-webview/react-native-webview#10 and this issue can be closed.

@kelset kelset closed this as completed Sep 24, 2018
@facebook facebook locked as resolved and limited conversation to collaborators Sep 24, 2019
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Sep 24, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Component: WebView Related to the WebView component. Platform: Android Android applications. Platform: Linux Building on Linux. Resolution: Locked This issue was locked by the bot.
Projects
None yet
Development

No branches or pull requests

5 participants