1

Basically, I'm searching for useful react-bootstrap wrapper. During reviewing different possibilities i've found this github project. I've forked them and start updating versions. But after updating scalajs-react version from 0.8.1 to 0.9.2 i've stuck in a rut with html.Element vs dom.Element.

Affix object call getDOMNode() on scope

val domNode = scope.getDOMNode()

Earlier domNode was extend type TopNode = html.Element but in newest version domNode extend type TopNode = dom.Element that don't have values such as 'className', 'offsetHeight' and 'style'. So I get compilation failures

[error] /Users/vl/dev/git/scalajs-react-bootstrap/core/src/main/scala/com/acework/js/components/bootstrap/Affix.scala:94: value offsetHeight is not a member of japgolly.scalajs.react.TopNode
[error]         } else if (offsetBottom.isDefined && (position.top + domNode.offsetHeight >= scrollHeight - offsetBottom.get)) {
[error]                                                                      ^
[error] /Users/vl/dev/git/scalajs-react-bootstrap/core/src/main/scala/com/acework/js/components/bootstrap/Affix.scala:102: value style is not a member of japgolly.scalajs.react.TopNode
[error]             domNode.style.top = ""
[error]                     ^
[error] /Users/vl/dev/git/scalajs-react-bootstrap/core/src/main/scala/com/acework/js/components/bootstrap/Affix.scala:53: value className is not a member of japgolly.scalajs.react.TopNode
[error]         var className = affixRegexp.replaceAllIn(node.className, "")
[error]                                                       ^

How can I manage it in newest scalajs-react version? (As I understand this functionality were moved to separate project 'scalajs-dom')

falcon
  • 372
  • 3
  • 19
  • 1
    I don't know the react facade, so I don't know the *right* answer, but as a quick workaround you could probably use domNode.asInstanceOf[html.Element] to get yourself over the immediate hump. (Provided, of course, that you're confident it *is* an HTML Element.) – Justin du Coeur Sep 30 '15 at 15:22
  • I think that it's bad idea. `className` can be replaced by `classList` with some fixes in source code. I don't know how to replace `offsetHeight` and `style`. But maybe It would work. Will try... – falcon Sep 30 '15 at 16:49
  • 1
    I was also trying to upgrade to 0.9.1 few months back. Here is a fork https://github.com/simerplaha/scalajs-react-bootstrap ... But I can't seem to find the issues you are having in Affix.scala. We've been using the fork version for a while in production now but I would suggest you also look at https://github.com/payalabs/scalajs-react-bridge which uses macros to generate React components (Much easier!). – user794783 Sep 30 '15 at 22:07
  • 1
    @CMR I've reviewed your fork and found useful implicit `import japgolly.scalajs.react.extra.DefaultReusabilityOverlay.autoLiftHtml` which basically cast `dom.Element` to `html.Element` as mentioned above by @Justin du Couer. Thanks for your advises. – falcon Oct 01 '15 at 07:52

1 Answers1

0

Useful import is

import japgolly.scalajs.react.extra.DefaultReusabilityOverlay.autoLiftHtml
falcon
  • 372
  • 3
  • 19