How to use the @aurelia/runtime.LifecycleFlags.fromBind function in @aurelia/runtime

public $bind(flags: LifecycleFlags, scope: IScope, part?: string): void {
    if (Tracer.enabled) { Tracer.enter('Listener', '$bind', slice.call(arguments)); }
    if (this.$state & State.isBound) {
      if (this.$scope === scope) {
        if (Tracer.enabled) { Tracer.leave(); }
        return;
      }

      this.$unbind(flags | LifecycleFlags.fromBind);
    }
    // add isBinding flag
    this.$state |= State.isBinding;

    this.$scope = scope;
    this.part = part;

    const sourceExpression = this.sourceExpression;
    if (hasBind(sourceExpression)) {
      sourceExpression.bind(flags, scope, this);
    }

    this.handler = this.eventManager.addEventListener(
      this.dom,
      this.target,
      this.targetEvent,

public initializeComponent(): void {
    if (this.contentStatus !== ContentStatus.loaded) {
      return;
    }
    // Don't initialize cached content
    if (!this.fromCache) {
      this.component.$controller.bind(LifecycleFlags.fromStartTask | LifecycleFlags.fromBind, null);
    }
    this.contentStatus = ContentStatus.initialized;
  }
  public terminateComponent(stateful: boolean = false): void {

public $bind(flags: LifecycleFlags, scope: IScope, part?: string): void {
    if (this.$state & State.isBound) {
      if (this.$scope === scope) {
        return;
      }
      this.$unbind(flags | LifecycleFlags.fromBind);
    }
    // add isBinding flag
    this.$state |= State.isBinding;

    // Store flags which we can only receive during $bind and need to pass on
    // to the AST during evaluate/connect/assign
    this.persistentFlags = flags & LifecycleFlags.persistentBindingFlags;

    this.$scope = scope;
    this.part = part;

    let sourceExpression = this.sourceExpression;
    if (hasBind(sourceExpression)) {
      sourceExpression.bind(flags, scope, this);
    }

it('updates its child\'s binding context when its value changes', function () {
    const { attribute } = hydrateCustomAttribute(With);
    const child = attribute['currentView'];

    attribute.$bind(LifecycleFlags.fromBind, createScopeForTest());

    let withValue = {};
    attribute.value = withValue;
    expect(child.$scope.bindingContext).to.equal(withValue);

    withValue = {};
    attribute.value = withValue;
    expect(child.$scope.bindingContext).to.equal(withValue);
  });
});

function createFixture(initialValue: Anything = '', options = [], multiple = false) {
    const ctx = TestContext.createHTMLTestContext();
    const { dom, lifecycle, observerLocator } = ctx;

    const optionElements = options.map(o =&gt; `<option value="${o}">${o}</option>`).join('\n');
    const markup = `<select>\n${optionElements}\n</select>`;
    const el = ctx.createElementFromMarkup(markup) as HTMLSelectElement;
    const sut = observerLocator.getObserver(LF.none, el, 'value') as SelectValueObserver;
    sut.setValue(initialValue, LF.fromBind);

    return { ctx, lifecycle, el, sut, dom };
  }

      () => [LF.fromBind,                                            `fromBind               `],
      () => [LF.updateTargetInstance,                                `updateTarget           `],

{ t: '6', bindTwice: true,  newScopeForDuplicateBind: true,  newValueForDuplicateBind: true,  attachTwice: false, detachTwice: false, unbindTwice: false },
    { t: '7', bindTwice: true,  newScopeForDuplicateBind: false, newValueForDuplicateBind: true,  attachTwice: false, detachTwice: false, unbindTwice: false }
  ];

  const bindSpecs: BindSpec[] = [
    { t: '1', ifPropName: 'ifValue', elsePropName: 'elseValue', ifText: 'foo', elseText: 'bar', value1: true,  value2: true  },
    { t: '2', ifPropName: 'ifValue', elsePropName: 'elseValue', ifText: 'foo', elseText: 'bar', value1: true,  value2: false },
    { t: '3', ifPropName: 'ifValue', elsePropName: 'elseValue', ifText: 'foo', elseText: 'bar', value1: false, value2: true  },
    { t: '4', ifPropName: 'ifValue', elsePropName: 'elseValue', ifText: 'foo', elseText: 'bar', value1: false, value2: false },
  ];

  const none = LifecycleFlags.none;
  const fromFlush = LifecycleFlags.fromFlush;
  const start = LifecycleFlags.fromStartTask;
  const stop = LifecycleFlags.fromStopTask;
  const bind = LifecycleFlags.fromBind;
  const attach = LifecycleFlags.fromAttach;
  const detach = LifecycleFlags.fromDetach;
  const unbind = LifecycleFlags.fromUnbind;
  const flushBind = fromFlush | bind;
  const flushAttach = fromFlush | attach;
  const flushDetach = fromFlush | detach;
  const flushUnbind = fromFlush | unbind;
  const startBind = start | bind;
  const startAttach = start | attach;
  const stopDetach = stop | detach;
  const stopUnbind = stop | unbind;

  const mutationSpecs: MutationSpec[] = [
    { t: '01', newValue1: false, newValue2: false, },
    { t: '02', newValue1: false, newValue2: true,  },
    { t: '03', newValue1: true,  newValue2: false, },

public handleChange(newValue: unknown, previousValue: unknown, flags: LifecycleFlags): void {
    if ((flags & LifecycleFlags.fromBind) > 0 || this.persistentFlags === LifecycleFlags.noTargetObserverQueue) {
      this.synchronizeElement();
    } else {
      this.hasChanges = true;
    }
    if (this.persistentFlags !== LifecycleFlags.persistentTargetObserverQueue && this.task === null) {
      this.task = this.scheduler.queueRenderTask(() => this.flushChanges(flags));
    }
    this.callSubscribers(newValue, previousValue, flags);
  }

public setValue(newValue: string | null, flags: LifecycleFlags): void {
    this.currentValue = newValue;
    this.hasChanges = newValue !== this.oldValue;
    if ((flags & LifecycleFlags.fromBind) > 0) {
      this.flushRAF(flags);
    }
  }