[presentation-api] Receiver does not receive the initial message

Mathieu-R has just created a new issue for https://github.com/w3c/presentation-api:

== Receiver does not receive the initial message ==
I'm using presentation api to cast a media.
Once I'm connected to the receiver i'm trying to send an initial payload that contains the informations about media.
However the receiver receives nothing. 
Next messages are received though.

As you can see in the code, I'm waiting to be in connected state to send the informations.
Maybe I should wait another event ?
Note : window.\_\_connection\_\_ was just to test message sending in the console.

If you need a repo for bug reproduction : https://github.com/Mathieu-R/streamwave

```js
this.chromecast = new Chromecaster(url);
this.chromecaster.cast().then(_ => {
  // send information for the receiver
  this.chromecaster.sendTrackInformations();
}).catch(err => console.error(err));
```

```js
// Chromecast class
  async setConnection (connection) {
    return new Promise(async resolve => {
      // 1. disconnect from existing presentation if any
      if (this.connection && this.connection !== connection && this.connection.state !== Chromecaster.CLOSED_STATE) {
        this.connection.close();
      }

      // 2. set the connection, save the presentation id in cache in order to allow reconnection
      this.connection = connection;
      window.__connection__ = connection;
      await set(Chromecaster.CHROMECAST_IDB_KEY, connection.id);

      // event listeners
      this.connection.onmessage = evt => {
        console.log(`message from: ${evt.target.id}. Received: "${evt.data}"`);
      }

      this.connection.onconnect = _ => {
        this.updateUI({chromecasting: true});
        resolve();
      }

      this.connection.onclose = _ => {
        this.connection = null;
        this.updateUI({chromecasting: false});
      }

      this.connection.onterminate = _ => {
        del(Chromecaster.CHROMECAST_IDB_KEY).then(_ => {
          this.connection = null;
          this.updateUI({chromecasting: false});
        });
      }
    });
  }

  cast () {
    return new Promise(async (resolve) => {
      // try to reconnect to old presentation
      const id = await get(Chromecaster.CHROMECAST_IDB_KEY);
      let connection;

      if (!id) {
        this.request.start();
      } else {
        this.reconnect(id);
      }

      // wait until connection is available
      // otherwise we would send data before connection is ready
      navigator.presentation.defaultRequest.onconnectionavailable = async evt => {
        await this.setConnection(evt.connection);
        resolve();
      }
    });
  }

  sendTrackInformations () {
    const state = store.getState();
    const data = {
      type: 'song',
      artist: state.player.artist,
      album: state.player.album,
      track: state.player.track,
      currentTime: state.player.currentTime,
      playing: state.player.playing,
      primaryColor: state.player.primaryColor
    };
    this.send(data);
  }

  send (data) {
    if (!this.connection) {
      console.warn('[Presentation API] no active connection...');
      return;
    }

    this.connection.send(JSON.stringify(data));
  }
```

Thanks for your help.

Please view or discuss this issue at https://github.com/w3c/presentation-api/issues/450 using your GitHub account

Received on Tuesday, 22 May 2018 07:41:15 UTC