function prepareTargetWithGivenDirection(dir, preferTopPosition = undefined) {
  style.setStyle(document.body, 'direction', dir);

  fieldDiv.style.direction = dir;
  fieldDiv.innerHTML = '<a href="http://www.google.com">Google</a>';
  link = fieldDiv.firstChild;

  panelId = bubble.addPanel('A', 'Link', link, (el) => {
    el.innerHTML = '<div style="border:1px solid blue;">B</div>';
  }, preferTopPosition);
}
This is a helper function for setting up the target element with a
given direction.
@param {string} dir The direction of the target element, 'ltr' or 'rtl'.
@param {boolean=} preferTopPosition Whether to prefer placing the bubble
    above the element instead of below it. Defaults to preferring below.