[GH-ISSUE #152] Set state causing segmentation fault 11 #94

New issue

Closed

opened 2026-05-05 11:41:11 -06:00 by gitea-mirror · 3 comments

gitea-mirror commented

2026-05-05 11:41:11 -06:00

Owner

Originally created by @n8jadams on GitHub (Jun 1, 2018).
Original GitHub issue: https://github.com/kusti8/proton-native/issues/152

This is such an intriguing library with a ton of potential! I must be doing something wrong, because I cannot accomplish a very simple task. (I am running on MacOS)

Using the following code:

import React from 'react';

import {
  render,
  App,
  Window,
  Box,
  Text,
  Button,
} from 'proton-native';

class Main extends React.Component {
  constructor() {
    super();
    this.state = {
      showMessage: false
    }
  }

  render() {
    return (
      <App>
        <Window title="Hello World" size={{w: 500, h: 500}}>
          <Box>
            {this.state.showMessage && (
              <Text>Hello World</Text>
            )}
            <Button
              onClick={() => this.setState({showMessage: !this.state.showMessage})}
            >
              Toggle the message
            </Button>
          </Box>
        </Window>
      </App>
    );
  }
}

render(<Main />);

It renders the app, but then when I click the button I get Segmentation fault: 11.
Why is this? I can run the charts.js example code just fine...

Originally created by @n8jadams on GitHub (Jun 1, 2018). Original GitHub issue: https://github.com/kusti8/proton-native/issues/152 This is such an intriguing library with a ton of potential! I must be doing something wrong, because I cannot accomplish a very simple task. (I am running on MacOS) Using the following code: ``` import React from 'react'; import { render, App, Window, Box, Text, Button, } from 'proton-native'; class Main extends React.Component { constructor() { super(); this.state = { showMessage: false } } render() { return ( <App> <Window title="Hello World" size={{w: 500, h: 500}}> <Box> {this.state.showMessage && ( <Text>Hello World</Text> )} <Button onClick={() => this.setState({showMessage: !this.state.showMessage})} > Toggle the message </Button> </Box> </Window> </App> ); } } render(<Main />); ``` It renders the app, but then when I click the button I get `Segmentation fault: 11`. Why is this? I can run the `charts.js` example code just fine...

gitea-mirror closed this issue

2026-05-05 11:41:13 -06:00

gitea-mirror commented

2026-05-05 11:41:18 -06:00

Author

Owner

@mischnic commented on GitHub (Jun 1, 2018):

Can reproduce on macOS.
It seems like rendering with this.state.showMessage = true doesn't actually render the Text if it isn't the initial render. Then with false, there is no text to delete and it crashes (stack trace contains uiBoxDelete).

@mischnic commented on GitHub (Jun 1, 2018): Can reproduce on macOS. It seems like rendering with `this.state.showMessage = true` doesn't actually render the Text if it isn't the initial render. Then with `false`, there is no text to delete and it crashes (stack trace contains `uiBoxDelete`).

gitea-mirror commented

2026-05-05 11:41:22 -06:00

Author

Owner

@n8jadams commented on GitHub (Jun 1, 2018):

If I wrap the "if and” check in a <Box> component, it works as expected. (Same thing works with a ternary.)

<Box>
  {this.state.showMessage && (
    <Text>Show this message</Text>
  )}
</Box>

<Box>
  {this.state.showMessage ? (
    <Text>Show this message</Text>
  ) : null }
</Box>

This is resolved enough for me.

@n8jadams commented on GitHub (Jun 1, 2018): If I wrap the "if and” check in a `<Box>` component, it works as expected. (Same thing works with a ternary.) ``` <Box> {this.state.showMessage && ( <Text>Show this message</Text> )} </Box> ``` or ``` <Box> {this.state.showMessage ? ( <Text>Show this message</Text> ) : null } </Box> ``` This is resolved enough for me.

gitea-mirror commented

2026-05-05 11:41:25 -06:00

Author

Owner

@mischnic commented on GitHub (Jun 1, 2018):

I must be doing something wrong

You aren't. This should work.
Could you please reopen the issue?

It also works correctly if the button is placed above the conditional text.

@mischnic commented on GitHub (Jun 1, 2018): > I must be doing something wrong You aren't. This should work. Could you please reopen the issue? It also works correctly if the button is placed above the conditional text.

gitea-mirror referenced this issue

2026-05-05 11:57:07 -06:00

[PR #94] [CLOSED] Fix typo #256