hyperstack-org / hyperstack-org/hyperstack

es6 modules are assumed to have a default component

Open
#231 1 comment 0 reactions 0 assignees View on GitHub
bug good first issue
Dominant language
JavaScript
Stars
538
Forks
41
PR merge metrics
No merged PRs in 30d

Description

related to #185

ES6 modules may not always have a default component. For example `Material-UI`.

The problem is the `eval_native_react_component` method assumes if its an es6 module, then there must be a default. This causes that method to attempt to evaluate properties of `undefined`.

The fix is to check if its an es6 module AND does it have a default:

```ruby
module Hyperstack
module Internal
module Component
class ReactWrapper
...
def self.eval_native_react_component(name)
component = `eval(name)`
raise "#{name} is not defined" if `#{component} === undefined`
# ------------> the following && component.default needs to be added <-------------
component = `component.default` if `component.__esModule && component.default`
is_component_class = `#{component}.prototype !== undefined` &&
(`!!#{component}.prototype.isReactComponent` ||
`!!#{component}.prototype.render`)
has_render_method = `typeof #{component}.render === "function"`
unless is_component_class || stateless?(component) || has_render_method
raise 'does not appear to be a native react component'
end
component
end
end
end
end
end
```

As a work around you can do this in your pack files:
```javascript
Mui = require('@material-ui/core');
Mui.default = Mui // <--- add this line ----
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.