Comments (26)
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.
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.
@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.
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.
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.
Thank you @psegalen, I implemented the fix and seems to be working so far! You areπ₯ π
from react-native-ui-kitten.
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.
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.
Got the same issue
from react-native-ui-kitten.
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.
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.
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.
@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.
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.
Got the same issue with Datepicker
from react-native-ui-kitten.
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.
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.
Has this issue been addressed?
Experiencing the same with @ui-kitten/components: 5.3.1
from react-native-ui-kitten.
Has anyone found a workaround or fix?
from react-native-ui-kitten.
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.
I also need that fix. Can someone explain, please?
from react-native-ui-kitten.
+1 for patching with @jgillick @psegalen solution
from react-native-ui-kitten.
tested within my current ongoing project, the patch from @jgillick works.
from react-native-ui-kitten.
Project abandoned?
from react-native-ui-kitten.
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.
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)
- Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle. HOT 3
- [Popover] Using flex on the anchor element
- The accessoryRight display of ListItem is incomplete
- Custom mapping when applying text-font-family is not working correctly on android HOT 1
- React Native UI-Kitten Overflow Menu inside Top Navigation renders on left first before rendering to Right. HOT 8
- Custom theme background color does not show right
- Duplication of the month name 'March' in the calendar between 1981 and 1984.
- Modal no longer appears after upgrade
- How to customize Input element through mapping.json? HOT 1
- View Pager selectedIndex fails to change the page shown after manually swiping a page
- Exception thrown while executing UI block: - [RNSVGSvgView setOnClick]: unrecognized selector sent to instance 0x01071ca460
- Modal is vibrating HOT 1
- Input breaks inside a Scrollview
- Select option inner radius issue HOT 1
- Google Play store link of kitten tricks APP is 404 not found HOT 1
- Feature of Initials in Avatar component
- Is this project abandoned? HOT 7
- Can't find variable: React
- BottomNavigationTab has wrong offset on iOS HOT 1
- hi, how to generate multiple tab in tabview HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native-ui-kitten.