Problems getting custom pairing views to work

Developers
1

I’m trying to get a simple custom pairing flow to work. But i get strange results and is clearly missing something obvious.

Pairing via Homey Developer Tools always get me back to the same view (manual_pairing) when i press the ‘add device’ button. I can see in the logs that the view for some reason is shown twice.

Pairing in app gives a blank screen after pressing the button. Cancelling the pairing from there actually adds adds the device. I have tried with and without a second view called ‘done’ that has a Homey.done()

Any ideas? Thanks in advance! :slight_smile:

Flow:

  • Three fields in a form
  • A connectivity/validation check in the driver/backend
  • createDevice from view
  • Done

driver.compose.json

  "pair": [
    {
      "id": "manual_pairing",
      "navigation": { "next": "done" }
    },
    {
      "id": "done"
    }]

driver.js

  async onPair(session) {

    session.setHandler('manual_pairing', async (data) => {
      //TODO: A backend connection test will be made from here, for now lets assume everything is ok.
      console.log(`FE emitted from manual_pairing - ${data.ipaddress}`);
      return true;
    });
   
    session.setHandler("showView", async (viewId) => {
      console.log("debug - view: " + viewId);
    });
  }

manual_pairing.html

...3 field form and a button...
<script type="application/javascript">

  let connectElement = document.getElementById('connect');

  connectElement.addEventListener('click', (e) => manualPairing());

  function manualPairing() {
    let ipaddress = document.getElementById('ipaddress').value.trim();
    let deviceid = document.getElementById('deviceid').value.trim();
    let accesscode = document.getElementById('accesscode').value.trim();

    Homey.emit('manual_pairing', {
      ipaddress: ipaddress,
      deviceid: deviceid,
      accesscode: accesscode
    })
      .then(result => {
        console.log('back from backend with result ' + result);

        if (result) {
          console.log('debug - adding ' + deviceid);
          Homey.createDevice({
            name: deviceid,
            data: {
              id: deviceid,
            },
            store: {},
            settings: {
              ipaddress: ipaddress,
              accesscode: accesscode
            }
          })
          .then(() => {
            console.log('Device created successfully');
            //Homey.done();
          })
          .catch(error => {
            console.error('Error creating device:', error);
          });

          console.log('debug - added ' + deviceid);
        }
      });
  }

</script>

done.html

<script type="application/javascript">
    Homey.done();
</script>

Logs

Backend

debug - view: manual_pairing
FE emitted from manual_pairing - testip
debug - view: manual_pairing

FrontEnd

image
image1186×949 47.2 KB

2

Since it’s not showing “Device created successfully’”, the issue is probably caused by Homey.createDevice() failing (perhaps if you’re trying to create devices with the same id as an existing device).

There’s however an issue with that method (see here) that can cause it to fail silently.

1 Like
3

Thanks Robert for your help! And yes you are correct. It is somewhere in createDevice it blowing up without an error.

Do you know if i can add it directly in the onPair on the backend? It has all the information anyway.

4

I don’t think so, no (which has always struck me as very strange: most of the pairing process is done in the backend, but actually creating the device has to be done in the frontend).

1 Like
5

Thanks to one of your other replies in another thread i think i found the problem. At least the initial tests shows much better results now.

I had simply forgot to set the type on the button.

<button type="button" ...

And there i was deep in trying to find the issue with promises and async/awaits…

Thanks again Robert!

1 Like