Search code examples
scalascala.jsreact-bootstrapscalajs-react

scalajs-react migration from 0.8.1 to 0.9.2


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')


Solution

  • Useful import is

    import japgolly.scalajs.react.extra.DefaultReusabilityOverlay.autoLiftHtml