Problema de arrastre de componentes personalizados

Así es como he creado un componente personalizado:

comps.addType('custom-video', {
  extiende: 'imagen',
  isComponent: function (el) {
    si (el.getAttribute && el.getAttribute('element-type') === 'custom-video') {
      return {type: 'custom-video'};
    }
  },
  modelo: {
    Predeterminados: {
      'tipo de vista previa de vídeo': 'gif',
      rasgos: [{
        tipo: 'select',
        etiqueta: 'Tipo',
        Nombre: 'tipo de avance de vídeo',
        opciones: [{valor: 'GIF', nombre: 'GIF'},
          {valor: 'imagen', nombre: 'Imagen'}],
        cambioprop: 1
      }],
      Seleccionable: Verdadero
    },
    init: function () {
      this.listenTo(this, 'change:video-preview-type', this.updateSrc);
    },
    updateSrc: function (component, value) {
      atributos const = componentes.atributos.atributos;
      Que src;
      si (valor === 'gif') {
        src = atributos['gif'];
      } si no (valor === 'imagen') {
        src = atributos['imagen'];
      }
      component.view.$el.find('img').attr('src', src);
      this.set('src', src);
    }
  },
  Vista: {
    eventos: {
      dblclick: función () {
        postDoubleClickEvent(EditorEvents.VIDEO_DOUBLE_CLICK);
      }
    }
  }
});

Este es mi bloque personalizado:

blockManager.add('Video', {
  etiqueta: 'Vídeo',
  Contenido: '<a style="display: inline-block"><img element-type="vaetas-video" style="width: 400px; object-fit: cover" src="https://argoswimvideo.com/wp-content/uploads/2017/11/video-placeholder-1280x720-40.jpg"></a>',
  atributos: {
    Clase: 'GJS-Block FA FA-Film',
    título: 'Insertar vídeo'
  }
});

El caso es que he envolvido la etiqueta de imagen dentro <a> de la etiqueta cuando se renderiza en lienzo. Cuando hago clic en el elemento e intento arrastrarlo, solo <img> <a> arrastra la etiqueta y permanece en su lugar original.

Demo en directo