How to use the @polymer/polymer/polymer-legacy.js.Polymer.dom function in @polymer/polymer

haxToContent: function() {
    // remove from the body area so we can generate a legit html structure
    this.hideContextMenus();
    var __active = this.activeNode;
    // null this to drop hax based classes
    Polymer.HaxStore.write("activeNode", null, this);
    Polymer.HaxStore.write("activeContainerNode", null, this);
    let children = Polymer.dom(this.$.body).getDistributedNodes();
    if (this.globalPreferences.haxDeveloperMode) {
      console.log(children);
    }
    var content = "";
    for (var i = 0, len = children.length; i < len; i++) {
      // see if this is a valid element or not, providing
      // some mild front-end sanitization
      if (this._haxElementTest(children[i])) {
        children[i].removeAttribute("data-editable");
        children[i].removeAttribute("data-hax-ray");
        children[i].contentEditable = false;
        content += Polymer.HaxStore.haxNodeToContent(children[i]);
        if (children[i].tagName.toLowerCase() === "grid-plate") {
          this._applyContentEditable(this.editMode, children[i]);
        }
      }

_downKeyPressed: function(e) {
    if (
      this.editMode &&
      Polymer.dom(this.activeContainerNode).textContent === ""
    ) {
      let node = Polymer.dom(this.activeContainerNode);
      // try and focus on the next thing
      try {
        node.nextElementSibling.focus();
      } catch (e) {
        // do nothing, at bottom
      }
    }
  },
  /**

_applyContentEditable: function(status, target = this.$.body) {
    let children = Polymer.dom(target).getDistributedNodes();
    // fallback for content nodes if not polymer managed nodes above
    if (children.length === 0) {
      children = Polymer.dom(target).getEffectiveChildNodes();
    }
    for (var i = 0, len = children.length; i < len; i++) {
      // we have to tell the browser that primatives are editable
      if (this._HTMLPrimativeTest(children[i])) {
        children[i].contentEditable = status;
      }
      // this does the real targetting
      if (this._haxElementTest(children[i])) {
        if (status) {
          children[i].setAttribute("data-editable", status);
          children[i].setAttribute("data-hax-ray", children[i].tagName);
        } else {
          children[i].removeAttribute("data-editable");
          children[i].removeAttribute("data-hax-ray");
        }
      }

);
            this.$$("#col" + cols[j]).addEventListener(
              "dragend",
              this.dragEnd.bind(this)
            );
            this.$$("#col" + cols[j]).addEventListener("dragover", function(e) {
              e.preventDefault();
            });
            this.$$("#col" + cols[j]).setAttribute("data-draggable", true);
          }
        }
      });
    }
    // flipping from true to false
    else if (!newValue && oldValue) {
      let children = Polymer.dom(this).children;
      // walk the children and apply the draggable state needed
      for (var i in children) {
        children[i].removeEventListener("drop", this.dropEvent.bind(this));
        children[i].removeEventListener("dragstart", this.dragStart.bind(this));
        children[i].removeEventListener("dragend", this.dragEnd.bind(this));
        children[i].removeEventListener("dragover", function(e) {
          e.preventDefault();
        });
        children[i].removeAttribute("draggable");
        children[i].removeAttribute("data-draggable");
        children[i].removeAttribute("tabindex");
      }
      this.async(() => {
        let cols = [1, 2, 3, 4];
        for (var j in cols) {
          if (!this["hideCol" + cols[j]]) {

continueGameTap: function(e) {
    // destroy this so it rebuilds every time for correct target element
    // while focusing on the next item just to place keyboard focus more
    // logically
    if (
      typeof this.__activeTap !== typeof undefined &&
      Polymer.dom(this.__activeTap).parentNode.nextElementSibling
        .firstElementChild != null
    ) {
      Polymer.dom(
        this.__activeTap
      ).parentNode.nextElementSibling.firstElementChild.firstElementChild.focus();
      delete this.__activeTap;
    } else if (
      typeof this.__activeTap !== typeof undefined &&
      Polymer.dom(this.__activeTap).parentNode.nextElementSibling
        .firstElementChild == null
    ) {
      this.__activeTap.focus();
      delete this.__activeTap;
    }
  },

}
      // insert at active insert point if we have one
      else if (this.activeContainerNode !== null) {
        // allow for inserting things into things but not grid plate
        if (
          newNode.tagName !== "GRID-PLATE" &&
          this.activeContainerNode.tagName === "GRID-PLATE" &&
          this.activeContainerNode !== this.activeNode
        ) {
          newNode.setAttribute("slot", this.activeNode.getAttribute("slot"));
          Polymer.dom(this.activeContainerNode).insertBefore(
            newNode,
            this.activeNode
          );
        } else {
          Polymer.dom(this).insertBefore(
            newNode,
            this.activeContainerNode.nextElementSibling
          );
        }
      } else {
        // send this into the root, which should filter it back down into the slot
        Polymer.dom(this).appendChild(newNode);
      }
      this.$.inlinecontextmenu.opened = false;
      // wait so that the DOM can have the node to then attach to
      setTimeout(() => {
        Polymer.HaxStore.write("activeContainerNode", newNode, this);
        Polymer.HaxStore.write("activeNode", newNode, this);
        // attempt to focus on the new node, may not always work
        newNode.focus();
        // scroll to it

dropEvent: function(e) {
    var normalizedEvent = Polymer.dom(e);
    var local = normalizedEvent.localTarget;
    // if we have a slot on what we dropped into then we need to mirror that item
    // and place ourselves below it in the DOM
    if (
      typeof this.__activeItem !== typeof undefined &&
      typeof local !== typeof undefined &&
      local.getAttribute("slot") != null &&
      this.__activeItem !== local
    ) {
      this.__activeItem.setAttribute("slot", local.getAttribute("slot"));
      Polymer.dom(this).insertBefore(this.__activeItem, local);
      // ensure that if we caught this event we process it
      e.preventDefault();
      e.stopPropagation();
    }
    // special case for dropping on an empty column or between items
    // which could involve a miss on the column
    else if (local.tagName === "RESPONSIVE-GRID-COL") {
      var col = local.id.replace("col", "");
      this.__activeItem.setAttribute("slot", "col-" + col);
      Polymer.dom(this).appendChild(this.__activeItem);
      // ensure that if we caught this event we process it
      e.preventDefault();
      e.stopPropagation();
    }
    let children = Polymer.dom(this).children;
    // walk the children and apply the draggable state needed

Polymer.HaxStore.instance.activePlaceHolder,
          newNode,
          Polymer.dom(Polymer.HaxStore.instance.activePlaceHolder).parentNode
        );
        Polymer.HaxStore.instance.activePlaceHolder = null;
      }
      // insert at active insert point if we have one
      else if (this.activeContainerNode !== null) {
        // allow for inserting things into things but not grid plate
        if (
          newNode.tagName !== "GRID-PLATE" &&
          this.activeContainerNode.tagName === "GRID-PLATE" &&
          this.activeContainerNode !== this.activeNode
        ) {
          newNode.setAttribute("slot", this.activeNode.getAttribute("slot"));
          Polymer.dom(this.activeContainerNode).insertBefore(
            newNode,
            this.activeNode
          );
        } else {
          Polymer.dom(this).insertBefore(
            newNode,
            this.activeContainerNode.nextElementSibling
          );
        }
      } else {
        // send this into the root, which should filter it back down into the slot
        Polymer.dom(this).appendChild(newNode);
      }
      this.$.inlinecontextmenu.opened = false;
      // wait so that the DOM can have the node to then attach to
      setTimeout(() => {

haxMoveGridPlate: function(direction, node, container) {
    // menu is actually in the element for render purposes
    this.hideContextMenus();
    // support moving things multiple directions
    switch (direction) {
      case "first":
        // ensure we can go up, first being a mode of up
        if (container.previousElementSibling !== null) {
          Polymer.dom(this).insertBefore(
            container,
            Polymer.dom(this).firstChild
          );
        }
        break;
      case "up":
        // ensure we can go up
        if (container.previousElementSibling !== null) {
          Polymer.dom(this).insertBefore(
            container,
            container.previousElementSibling
          );
        }
        break;
      case "down":
        if (container.nextElementSibling !== null) {
          Polymer.dom(this).insertBefore(
            container.nextElementSibling,

_haxResolvePreviousElement: function(node) {
    node = Polymer.dom(node).previousElementSibling;
    while (
      typeof node.tagName !== typeof undefined &&
      node.tagName.substring(0, 4) === "HAX-"
    ) {
      node = Polymer.dom(node).previousElementSibling;
    }
    return node;
  },
  /**