code: function addLoadingStateHandler( type, instance, item, pending, onChange ) {
        const subtopic = `${type}.${instance}.${item}`;
        const active = [];
  
        const willLoad = `willLoad.${subtopic}`;
        const didLoad = `didLoad.${subtopic}`;
        const willUnload = `willUnload.${subtopic}`;
        const didUnload = `didUnload.${subtopic}`;
  
        debugEventBus.subscribe( willLoad, ( { [ type ]: ref } ) => {
           pending.push( `${didLoad}:${ref}` );
        } );
        debugEventBus.subscribe( didLoad, ( { [ type ]: ref } ) => {
           remove( pending, `${didLoad}:${ref}` );
           active.push( ref );
           if( pending.length === 0 ) {
              onChange();
           }
        } );
        debugEventBus.subscribe( willUnload, ( { [ type ]: ref } ) => {
           pending.push( `${didUnload}:${ref}` );
        } );
        debugEventBus.subscribe( didUnload, ( { [ type ]: ref } ) => {
           remove( pending, `${didUnload}:${ref}` );
           remove( active, ref );
           if( pending.length === 0 ) {
              onChange();
           }
        } );
  
        return active;
     }
docs: ///////////////////////////////////////////////////////////////////////////////////////////////////////// 
  Create debugEventBus subscriptions for the load events related to the given type of artifact and scoped
  to the given instance and item.
  
  @param {String} type
  the type of load event (page, widget, etc.) to subscribe to
  @param {String} instance
  the instance name
  @param {String} item
  the bootstrapping item id
  @param {Array} pending
  an array to use for managing pending events
  @param {Function} onChange
  a function to call when a change occurred and there are no more pending events
  @return {Array}
  an array that will be updated with the currently active items of the given type in the given
  bootstrapping item.
  @private