Git Product home page Git Product logo

Comments (26)

jgillick avatar jgillick commented on June 2, 2024 8

For those using yarn patch or patch-package, here's the patch I'm using:

diff --git a/node_modules/@ui-kitten/components/devsupport/components/measure/measure.component.js b/node_modules/@ui-kitten/components/devsupport/components/measure/measure.component.js
index 02180f9..b51cca0 100644
--- a/node_modules/@ui-kitten/components/devsupport/components/measure/measure.component.js
+++ b/node_modules/@ui-kitten/components/devsupport/components/measure/measure.component.js
@@ -42,7 +42,7 @@ const MeasureElement = (props) => {
         if (frame.origin.x < window.size.width) {
             return frame;
         }
-        const boundFrame = new type_1.Frame(frame.origin.x - window.size.width, frame.origin.y, frame.size.width, frame.size.height);
+        const boundFrame = new type_1.Frame(frame.origin.x - window.size.width, frame.origin.y, Math.round(frame.size.width), Math.round(frame.size.height));
         return bindToWindow(boundFrame, window);
     };
     const onUIManagerMeasure = (x, y, w, h) => {
@@ -51,13 +51,13 @@ const MeasureElement = (props) => {
         }
         else {
             const originY = props.shouldUseTopInsets ? y + react_native_1.StatusBar.currentHeight || 0 : y;
-            const frame = bindToWindow(new type_1.Frame(x, originY, w, h), type_1.Frame.window());
+            const frame = bindToWindow(new type_1.Frame(x, originY, Math.round(w), Math.round(h)), type_1.Frame.window());
             props.onMeasure(frame);
         }
     };
     const measureSelf = () => {
         const node = (0, react_native_1.findNodeHandle)(ref.current);
-        react_native_1.UIManager.measureInWindow(node, onUIManagerMeasure);
+        if (node) react_native_1.UIManager.measureInWindow(node, onUIManagerMeasure);
     };
     if (props.force) {
         measureSelf();

from react-native-ui-kitten.

lapwil avatar lapwil commented on June 2, 2024 3

Experiencing the same issue with 5.3.1, it happens some time between navigations but not every time, really hard to narrow down what's really happening πŸ€”

from react-native-ui-kitten.

psegalen avatar psegalen commented on June 2, 2024 2

@GoDeepBlue you can patch UI Kitten with the code from my PR as a temporary solution until the PR is merged.
For this specific problem, the fix is at line 78 in https://github.com/akveo/react-native-ui-kitten/pull/1790/files
I have 2 apps on which this patch prevented the crash to be reported by crashlytics and sentry, one is patched with patch-package because it's a Yarn 1.x project, the other with yarn patch, both are ok now

from react-native-ui-kitten.

robpearmain avatar robpearmain commented on June 2, 2024 2

The solution is in measure.component.js to check for if (node):

 const measureSelf = () => {
        const node = (0, react_native_1.findNodeHandle)(ref.current);
        //react_native_1.UIManager.measureInWindow(node, onUIManagerMeasure);
        if (node) {
            react_native_1.UIManager.measureInWindow(node, onUIManagerMeasure);
        }
    };

However, I guess either a new release is needed or a patch, but not too confident

from react-native-ui-kitten.

GoDeepBlue avatar GoDeepBlue commented on June 2, 2024 1

I am receiving the same issue. Version is js on "@ui-kitten/components": "^5.3.1" and "react-native": "^0.73.1"

Issue occurs while navigating between screens and I have spent a ton of time trying to narrow down the bug. :/

Basically produces:
ERROR Error: Got unexpected undefined, js engine: hermes

Then trace gets to:
.../node_modules/@ui-kitten/components/devsupport/components/measure/measure.component.js with code
error spawn code ENOENT

Any help or workarounds? I am stuck :(

from react-native-ui-kitten.

GoDeepBlue avatar GoDeepBlue commented on June 2, 2024 1

Thank you @psegalen, I implemented the fix and seems to be working so far! You areπŸ₯‡ πŸ˜ƒ

from react-native-ui-kitten.

psegalen avatar psegalen commented on June 2, 2024 1

Hi @adrianlzx1996 and @brunomartins-com !
First of all: don't just edit directly the source files in node_modules because each time you'll do a dependencies install (through npm or yarn), your edition will be deleted.
You need to create a patch, there are basically 2 ways to do that and it depends if you use yarn 2+ or not.
For yarn 2+ you can use the built-in feature yarn patch, doc is there: https://yarnpkg.com/cli/patch
For yarn 1.x or npm, you can use the "patch-package" devDependency, here is tutorial: https://dev.to/zhnedyalkow/the-easiest-way-to-patch-your-npm-package-4ece
Anyway, for both tools the procedure is the same: once the tool is operational make your edition to the source code of your dependency in node_modules and launch the patch procedure, it will generate a patch (a file telling your dependencies manager that it needs to modify one dependency after its install and how to modify it)

from react-native-ui-kitten.

adrianlzx1996 avatar adrianlzx1996 commented on June 2, 2024 1

Hi @adrianlzx1996 and @brunomartins-com ! First of all: don't just edit directly the source files in node_modules because each time you'll do a dependencies install (through npm or yarn), your edition will be deleted. You need to create a patch, there are basically 2 ways to do that and it depends if you use yarn 2+ or not. For yarn 2+ you can use the built-in feature yarn patch, doc is there: https://yarnpkg.com/cli/patch For yarn 1.x or npm, you can use the "patch-package" devDependency, here is tutorial: https://dev.to/zhnedyalkow/the-easiest-way-to-patch-your-npm-package-4ece Anyway, for both tools the procedure is the same: once the tool is operational make your edition to the source code of your dependency in node_modules and launch the patch procedure, it will generate a patch (a file telling your dependencies manager that it needs to modify one dependency after its install and how to modify it)

Hey @psegalen thanks for your advise and reply!

from react-native-ui-kitten.

phongXenia avatar phongXenia commented on June 2, 2024

Got the same issue

from react-native-ui-kitten.

gani419 avatar gani419 commented on June 2, 2024

Got the same issue when navigating from login screen to home screen. Using Layout as parent in home screen.
Happening only for ios.

from react-native-ui-kitten.

psegalen avatar psegalen commented on June 2, 2024

I'm strugling to produce a repro but I'll try again tomorrow. Hopefully I'll be able to submit a fix then.

from react-native-ui-kitten.

chinmay4github1987 avatar chinmay4github1987 commented on June 2, 2024

While navigating some times i am getting "Got unexpected undefined" throwing this error. This is happening in iOS. Please help me out in fixing this.

from react-native-ui-kitten.

felipecamposfabel avatar felipecamposfabel commented on June 2, 2024

@chinmay4github1987 One workaround:

const isFocused = useIsFocused();

{isFocused && (<Select ... />)}

This is not pretty and you might need some placeholder so that your interface does not glitch... But if you have more time, go for @psegalen solution.

from react-native-ui-kitten.

chinmay4github1987 avatar chinmay4github1987 commented on June 2, 2024

T

@chinmay4github1987 One workaround:

const isFocused = useIsFocused();

{isFocused && (<Select ... />)}

This is not pretty and you might need some placeholder so that your interface does not glitch... But if you have more time, go for @psegalen solution.

It is happening during navigation means switching between screens

from react-native-ui-kitten.

linhvovan29546 avatar linhvovan29546 commented on June 2, 2024

Got the same issue with Datepicker

from react-native-ui-kitten.

psegalen avatar psegalen commented on June 2, 2024

I can't find a way to reproduce easily (and I can't publish my client's code), even by using Layout and playing with different things in navigation... :(
I think I'll submit a PR anyway because I'm pretty sure we should not ask for the size of a component being null or undefined...

from react-native-ui-kitten.

Sovaid-Shah avatar Sovaid-Shah commented on June 2, 2024

IsFocused workaround isn't supposedly working for me. I don't have a select component rather it happens on tab bar component. So is there a solution/workaround or are they ever going to merge this.

from react-native-ui-kitten.

its-me-sv avatar its-me-sv commented on June 2, 2024

Has this issue been addressed?
Experiencing the same with @ui-kitten/components: 5.3.1

from react-native-ui-kitten.

GoDeepBlue avatar GoDeepBlue commented on June 2, 2024

Has anyone found a workaround or fix?

from react-native-ui-kitten.

adrianlzx1996 avatar adrianlzx1996 commented on June 2, 2024

Thank you @psegalen, I implemented the fix and seems to be working so far! You areπŸ₯‡ πŸ˜ƒ

Hey @GoDeepBlue , could you briefly explain how did you apply the fix? Is it by manually editing the UI Kitten library in node_modules folder?

from react-native-ui-kitten.

brunomartins-com avatar brunomartins-com commented on June 2, 2024

I also need that fix. Can someone explain, please?

from react-native-ui-kitten.

evansendra avatar evansendra commented on June 2, 2024

+1 for patching with @jgillick @psegalen solution

from react-native-ui-kitten.

jurmadani avatar jurmadani commented on June 2, 2024

tested within my current ongoing project, the patch from @jgillick works.

from react-native-ui-kitten.

patrickacioli avatar patrickacioli commented on June 2, 2024

Project abandoned?

from react-native-ui-kitten.

patrickacioli avatar patrickacioli commented on June 2, 2024

For those using yarn patch or patch-package, here's the patch I'm using:

diff --git a/node_modules/@ui-kitten/components/devsupport/components/measure/measure.component.js b/node_modules/@ui-kitten/components/devsupport/components/measure/measure.component.js
index 02180f9..b51cca0 100644
--- a/node_modules/@ui-kitten/components/devsupport/components/measure/measure.component.js
+++ b/node_modules/@ui-kitten/components/devsupport/components/measure/measure.component.js
@@ -42,7 +42,7 @@ const MeasureElement = (props) => {
         if (frame.origin.x < window.size.width) {
             return frame;
         }
-        const boundFrame = new type_1.Frame(frame.origin.x - window.size.width, frame.origin.y, frame.size.width, frame.size.height);
+        const boundFrame = new type_1.Frame(frame.origin.x - window.size.width, frame.origin.y, Math.round(frame.size.width), Math.round(frame.size.height));
         return bindToWindow(boundFrame, window);
     };
     const onUIManagerMeasure = (x, y, w, h) => {
@@ -51,13 +51,13 @@ const MeasureElement = (props) => {
         }
         else {
             const originY = props.shouldUseTopInsets ? y + react_native_1.StatusBar.currentHeight || 0 : y;
-            const frame = bindToWindow(new type_1.Frame(x, originY, w, h), type_1.Frame.window());
+            const frame = bindToWindow(new type_1.Frame(x, originY, Math.round(w), Math.round(h)), type_1.Frame.window());
             props.onMeasure(frame);
         }
     };
     const measureSelf = () => {
         const node = (0, react_native_1.findNodeHandle)(ref.current);
-        react_native_1.UIManager.measureInWindow(node, onUIManagerMeasure);
+        if (node) react_native_1.UIManager.measureInWindow(node, onUIManagerMeasure);
     };
     if (props.force) {
         measureSelf();

The solution works!

from react-native-ui-kitten.

obayit avatar obayit commented on June 2, 2024

when I run npx patch-package "@ui-kitten" it gives an error, MODULE_NOT_FOUND
does the @ in the name affect the patch-package command?

Edit
I just learned that @ in a package name is indicating a namespace, and the package full name must be provided, so npx patch-package @ui-kitten/components worked.

from react-native-ui-kitten.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.