Don't detach pre-existing HTML when view's el is already in the region

[paulfalgout]

Related to #3128

When a view is attached to pre-existing DOM and then shown in a region, the view's el may already be inside of the region, but currently the region is unaware of this. So to allow for pre-generated HTML we detach the region HTML https://github.com/marionettejs/backbone.marionette/blob/master/src/region.js#L212
Which is then immediately re-attached in the region's show.

Functionally this works, but this is likely causing extra paints and it is detaching/attaching a view without throwing events, so anything setup externally to this HTML will break with no use-able hooks to handle the situation.

We could solve this in a couple of ways. The cheapest way is for a region to not empty itself if it doesn't have a view but the view being passed in to show is already attached.. This way assumes that the view's el is already in the region. Can anyone think of any other reason an already attached view should be shown in a region? Attaching a view to 2 regions seems like a horribly bad idea. But we could take it a step further to ensure the region contains the view el with something like Backbone.$.contains(this.el, view.el); But then what are we protecting against?

Conversely _attachView would need to bail out if the view was already attached. This pattern would I think also be applied to CollectionView This makes attach and render much more similar so I think I like it.

[scott-w]

About the only time I can see the former being useful is where:

var MyView = Mn.View.extend({
  region: {
    main: '.main-hook'
  },

  showSomeView: function() {
    this.showChildView('main', this._someView, {preventDestroy: true});
  },

  showDifferentView: function() {
    this.showChildView('main', this._differentView, {preventDestroy: true});
  },

  initialize: function() {
    this._someView = new SomeView();
    this._differentView = new DifferentView();
  }
});

It's not something I've personally done but maybe there's a lot of work involved setting up the view you might want to save on by just keeping them alive and swappable? This wouldn't involve showing a view in multiple places, however, just in the same place.

That leads me more to the latter solution, however, if this view is shown, do nothing - perhaps just using console.warn to assist debugging?

[paulfalgout]

The only way your example is a problem is if both views currently exist in the DOM prior to being shown in the region. Otherwise we'd be ok because the 2nd show would detach the other view, and it would resolve itself. The main issue here is when we're trying to show a view that is currently attached to the DOM inside the region it is being shown in. If another view is in there and they're begin swapped, we're ok now.

[scott-w]

So:

var someView = new SomeView();
view.showChildView('main', someView);
view.showChildView('main', someView);

is currently an issue?

Or are we thinking specifically for:

var someView = new SomeView();

view.showChildView('main', someView);
view.showChildView('other', someView);