expo-pixi icon indicating copy to clipboard operation
expo-pixi copied to clipboard

Sketch does not work with Expo 32.0.0

Open Nico924 opened this issue 5 years ago • 7 comments

I've tried to run the Sketch example with Expo 32.0.0

However when I start to draw on the rendered view form the example, I got this error

undefined is not an object (evaluating '_this.lastPoint.x')

onPanResponderMove
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:262219:33
onResponderMove
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:64261:38
invokeGuardedCallbackImpl
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:9888:21
invokeGuardedCallback
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:9974:42
invokeGuardedCallbackAndCatchFirstError
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:9978:36
executeDispatch
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:10170:48
executeDispatchesInOrder
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:10190:26
executeDispatchesAndRelease
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:10285:35
forEach
    [native code]:0
forEachAccumulated
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:10275:22
runEventsInBatch
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:10386:29
runExtractedEventsInBatch
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:10395:25
<unknown>
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:11363:36
batchedUpdates$1
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:20226:20
batchedUpdates
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:11305:37
_receiveRootNodeIDEvent
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:11362:23
receiveTouches
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:11392:34
__callFunction
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:3654:49
<unknown>
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:3427:31
__guard
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:3608:15
callFunctionReturnFlushedQueue
    AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=%2FUsers%2Fmakeit%2Fprojects%2Fwondercar-app%2Fnode_modules%2Fexpo%2Ftools%2FhashAssetFiles.js:3426:21
callFunctionReturnFlushedQueue
    [native code]:0

And here are my package

{
  "name": "wondercar",
  "version": "1.0.0",
  "private": true,
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "eject": "expo eject",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "test": "jest"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "rnpm": {
    "assets": [
      "assets/fonts/Source_Sans_Pro"
    ]
  },
  "devDependencies": {
    "babel-eslint": "^10.0.1",
    "babel-preset-expo": "^5.0.0",
    "eslint": "^5.9.0",
    "eslint-config-airbnb": "^17.0.0",
    "eslint-config-airbnb-base": "^13.1.0",
    "eslint-config-prettier": "^2.9.0",
    "eslint-import-resolver-webpack": "^0.10.1",
    "eslint-plugin-babel": "^5.1.0",
    "eslint-plugin-flowtype": "^2.50.0",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-jest": "^22.1.2",
    "eslint-plugin-jsx-a11y": "^6.1.1",
    "eslint-plugin-prettier": "^2.6.2",
    "eslint-plugin-promise": "^3.8.0",
    "eslint-plugin-react": "^7.10.0",
    "jest-expo": "^32.0.0",
    "prettier": "^1.15.3",
    "yeoman-generator": "^1.1.1"
  },
  "dependencies": {
    "@patwoz/react-navigation-is-focused-hoc": "^1.2.1",
    "axios": "^0.18.0",
    "expo": "^32.0.0",
    "expo-analytics": "^1.0.7",
    "expo-pixi": "^1.1.0",
    "immutable": "^3.8.1",
    "lodash": "^4.17.5",
    "moment": "^2.20.1",
    "react": "16.5.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz",
    "react-native-autocomplete-input": "^4.0.0",
    "react-native-chooser": "^1.6.1",
    "react-native-image-slider": "^1.1.5",
    "react-native-loading-spinner-overlay": "^0.5.2",
    "react-native-picker-select": "^2.0.1",
    "react-native-storage": "^0.2.2",
    "react-native-swipe-gestures": "^1.0.2",
    "react-navigation": "^3.0.9",
    "react-redux": "^5.0.7",
    "react-saga": "^0.2.5",
    "redux": "^3.7.2",
    "redux-form": "7.2.0",
    "redux-immutable": "^4.0.0",
    "redux-persist": "^5.4.0",
    "redux-persist-immutable": "^4.3.1",
    "redux-saga": "^0.15.6",
    "remote-redux-devtools": "^0.5.12",
    "remotedev-rn-debugger": "^0.8.3",
    "uuid": "^3.2.1"
  }
}

Thank you in advance for your help

Nico924 avatar May 06 '19 09:05 Nico924

I created a new project using SDK 31, and tried out the Sketch sample and got the same errors.

cabhara avatar May 06 '19 17:05 cabhara

same here does not work on ejected expo project with SDK 32

EKoetsjarjan avatar May 09 '19 10:05 EKoetsjarjan

Same problem here, it gives a warning and when I try to draw, it crashes.

[Unhandled promise rejection: TypeError: gl.createBuffer is not a function. (In 'gl.createBuffer()', 'gl.createBuffer' is undefined)]

  • node_modules/expo-2d-context/Expo2DContext.js:2394:24 in Expo2DContext
  • node_modules/@expo/browser-polyfill/src/DOM/Element.js:48:42 in getContext
  • node_modules/pixi.js/lib/core/renderers/canvas/CanvasRenderer.js:81:50 in CanvasRenderer
  • node_modules/pixi.js/lib/core/autoDetectRenderer.js:66:40 in autoDetectRenderer
  • node_modules/expo-pixi/lib/components/Signature.js:151:6 in _callee$
  • node_modules/@babel/runtime/node_modules/regenerator-runtime/runtime.js:45:44 in tryCatch
  • node_modules/@babel/runtime/node_modules/regenerator-runtime/runtime.js:271:30 in invoke
  • node_modules/@babel/runtime/node_modules/regenerator-runtime/runtime.js:45:44 in tryCatch
  • node_modules/@babel/runtime/node_modules/regenerator-runtime/runtime.js:135:28 in invoke
  • node_modules/@babel/runtime/node_modules/regenerator-runtime/runtime.js:170:17 in
  • node_modules/promise/setimmediate/core.js:45:7 in tryCallTwo
  • node_modules/promise/setimmediate/core.js:200:23 in doResolve
  • node_modules/promise/setimmediate/core.js:66:12 in Promise
  • node_modules/@babel/runtime/node_modules/regenerator-runtime/runtime.js:169:27 in callInvokeWithMethodAndArg
  • node_modules/@babel/runtime/node_modules/regenerator-runtime/runtime.js:192:38 in enqueue
  • node_modules/@babel/runtime/node_modules/regenerator-runtime/runtime.js:216:8 in async
  • node_modules/expo-pixi/lib/components/Signature.js:134:20 in _callee
  • node_modules/expo-gl/src/GLView.js:121:33 in _onSurfaceCreate
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:92:15 in invokeGuardedCallbackImpl
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:306:36 in invokeGuardedCallback
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:330:30 in invokeGuardedCallbackAndCatchFirstError
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:699:42 in executeDispatch
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:726:20 in executeDispatchesInOrder
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:884:29 in executeDispatchesAndRelease
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:865:12 in forEachAccumulated
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:1050:6 in runEventsInBatch
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:1075:19 in runExtractedEventsInBatch
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:2713:6 in
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:15311:14 in batchedUpdates$1
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:2616:31 in batchedUpdates
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:2711:17 in _receiveRootNodeIDEvent
  • node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:2731:26 in receiveEvent
  • node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:349:47 in __callFunction
  • node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:106:26 in
  • node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:297:10 in __guard
  • node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:105:17 in callFunctionReturnFlushedQueue
  • [native code]:null in callFunctionReturnFlushedQueue

gabriela-sartori avatar May 09 '19 13:05 gabriela-sartori

the strange thing is that it fallbacks to CanvasRenderer while it gets a gl-context from react-native can Expo2DContext work with a CanvasRenderer instead of WebGLContext?

EKoetsjarjan avatar May 09 '19 14:05 EKoetsjarjan

Try this for the gl.createBuffer issue: I added "@expo/browser-polyfill": "0.0.1-alpha.3" to my node modules and made sure that expo-pixi is on version 1.0.1

Use npm ls @expo/browser-polyfill and npm ls expo-pixi to check the versions

lanklaas avatar May 09 '19 14:05 lanklaas

@lanklaas Thank you so much. You saved my life.

yangga avatar Jun 06 '19 15:06 yangga

This no longer works with latest version of Expo. I believe this library is the current solution: https://docs.expo.io/versions/latest/sdk/captureRef/

jonathanstiansen avatar Aug 17 '20 15:08 jonathanstiansen