Local Dev | How to sign in with Dev Wallet?

anders · May 16, 2021, 1:55pm

Hey guys,
I am having trouble getting setup with local development. I have the emulator running locally (latest version as of 2021-May-16) and I cloned the “Harness” repo to tryout signing in/out locally.

I can run scripts from the Harness page, but signing in does not work. See errors below.

I did update the config in the root.js file to reflect the output of the Dev Wallet start log.

From root.js

  fcl.config()
    .put("env", "local")
    .put("accessNode.api", "http://localhost:8080")
    .put("discovery.wallet", " http://localhost:8701/flow/authenticate")
    .put("challenge.handshake", " http://localhost:8701/flow/authenticate")

Output when starting local wallet

$ yarn run dev-wallet
yarn run v1.22.4
$ FLOW_ACCOUNT_ADDRESS=0xf8d6e0586b0a20c7 PK=f8e188e8af0b8b414be59c4a1a15cc666c898fb34d94156e9b51e18bfde754a5 fcl-wallet
@onflow/[email protected]
*** *** *** *** *** *** ***

🎉 FCL Dev Wallet has started:
* Origin:          http://localhost:8701
* FCL Authn:       http://localhost:8701/flow/authenticate
* GraphiQL:        http://localhost:8701/graphql
* Access Node:     http://localhost:8080
* Service Address: 01
* Private Key:     f8e188e8af0b8b414be59c4a1a15cc666c898fb34d94156e9b51e18bfde754a5

Include this code in development to configure fcl:

import * as fcl from "@onflow/fcl"

fcl.config()
  .put("challenge.handshake", "http://localhost:8701/flow/authenticate")

*** *** *** *** *** *** ***
GQL -- query/config
GQL -- mutation/authenticate { email: '[email protected]', pass: 'abc123' }
GQL -- query/config
GQL -- mutation/authenticate { email: '[email protected]', pass: 'abc123' }

Repo: https://github.com/orodio/harness

Error
* could not find account with address 0000000000000001

In the browser console (Chrome, on MacOSX) I get the following error

Uncaught (in promise) TypeError: Cannot read property 'sessionId' of null
    at Object.authenticate [as click] (flow-authenticate.js:44)

flowjosh · May 18, 2021, 7:03pm

@gregsantos @JeffreyDoyle Can you help answer the question here?

gregsantos · May 19, 2021, 4:11pm

It looks like you’ve implemented your own user/pw authentication.
Are you able to Log In via the Dev Wallet using fcl.authenticate and the default config?

Mackenzie · May 19, 2021, 8:13pm

By the looks of it there is a mismatch between what the cli output says and what is actually in the code.

I believe the correct configuration would be:

 fcl.config()
    .put("env", "local")
    .put("accessNode.api", "http://localhost:8080")
    .put("discovery.wallet", "http://localhost:8701/fcl/authn")
    .put("challenge.handshake", "http://localhost:8701/fcl/authn")

Reference implementation here:

github.com

orodio/harness/blob/main/src/root.js#L27


})

// prettier-ignore
fcl.config()
  .put("app.detail.title", "Test Harness")
  .put("app.detail.icon", "https://i.imgur.com/r23Zhvu.png")
  .put("service.OpenID.scopes", "email email_verified name zoneinfo")

if (true) {
  // prettier-ignore
  fcl.config()
    .put("env", "local")
    .put("accessNode.api", "http://localhost:8080")
    .put("discovery.wallet", "http://localhost:3000/fcl/authn")
    .put("challenge.handshake", "http://localhost:3000/fcl/authn")
} else {
  // prettier-ignore
  fcl.config()
    .put("env", "testnet")
    .put("accessNode.api", "https://access-testnet.onflow.org")
}

qvvg · May 20, 2021, 4:24pm

You are using the older dev wallet.
You can find the new one here: GitHub - onflow/fcl-dev-wallet: A FCL Dev Wallet to be used with the Flow Emulator

anders · May 23, 2021, 8:48am

Thanks. In the end, it was due to a misconfiguration I believe.

I found this repo, which added a critical part of information. Now it works! Thanks for replying!