In testing, "Failed to execute 'removeChild' on 'Node'" error occurs

[ykaragol]

There is a condition in a template (as shown in readme):

{{#if isShowing}}
  {{#ember-tether
      target='#a-nice-person'
      targetAttachment='top left'
      attachment='bottom left'
  }}
   <div id="my-puppy">
    A puppy
   </div>
  {{/ember-tether}}
{{/if}}

When the isShowing turned from true to false, it gives an error in tests.

It works perfect in an application but it fails in integration tests with the following error:

Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.

You can see its in the twiddle

I found a nearly same issue in ember-wormhole: https://github.com/yapplabs/ember-wormhole/issues/66. But the workaround didn't worked for this issue.

[Baskerville42]

I have the same issue

[jacojoubert]

Getting this in my application as well (not in tests). Happens when the div containing the tether component has a position: relative set to it.

[chrislopresto]

@ykaragol Thanks for the twiddle. A similar workaround to the one mentioned in https://github.com/yapplabs/ember-wormhole/issues/66 seems to do the trick:

{{#if isShowing}}
  <div>
    {{#ember-tether
        target='#a-nice-person'
        targetAttachment='top left'
        attachment='bottom left'
    }}
     <div id="my-puppy">
      A puppy
     </div>
    {{/ember-tether}}
  </div>
{{/if}}

You can see it in action in my fork of the twiddle

@Baskerville42 @jacojoubert @ykaragol does that work for you? We should PR the README regardless.

[ykaragol]

Yeap, it seems it is working.

[samselikoff]

Bizarrely, I'm running into the same symptom @jacojoubert. Removing position: relative on the parent fixes it, but I have no idea why.