How We Built It: Password Changer 2.0

Published in

Dashlane Engineering

6 min readMar 11, 2021

Are you using the same password everywhere? Did some of your accounts get breached recently? Do you simply want to regularly update your passwords?

At Dashlane, we know that there are plenty of reasons which might require you to change one or more passwords, and we know what a pain it is to do so manually. Can you imagine how much time you would save if these tedious tasks could be done automatically?

That’s why we decided to develop something really unique to help you: Password Changer. It now only takes a matter of seconds to change your passwords!

The challenge: Every website is different

There is no standard API on the web that we can use server-side to simply ask a website to change a password for a user. There are some emerging initiatives in this field ( from Apple for instance) but their adoption is still extremely low.

So, even though it would be wonderful if a unified API existed to let us magically change passwords, today we need to find another way. For now, on every website requiring a password to be changed, we have to actually understand and document the steps a user takes, click by click, field by field, in order to change a password. As you can imagine, there are some common themes across websites, but with some potentially major variations. Imagine changing your password on a banking website versus on an e-commerce or shopping website -the experience feels the same but it is in fact unique from site to site.

If we were to use the analogy of cooking, let’s say you wanted to cook the chocolate cake that you fondly remember from your childhood. This process has neither the same steps, nor the same ingredients as, say, a lemon pie. However, you’re always able to recognize that it’s a chocolate cake and not a lemon pie, even if both recipes yield desserts!

For websites it’s exactly the same, and that’s why our Password Changer is based on what we call recipes!

Photo by kaouther djouada on Unsplash

How does the Password Changer feature work?

Curious to know what goes on in our kitchen? Here are the steps:

Our journey starts with an application (the client, for example the iOS or Android app) ordering a dish: “I want to change my password for this website.”
The Password Changer engine (our chef) gets his recipe to prepare the dish, and will try to execute it as best as he can. The recipe for changing passwords is unique for each website. We have one for amazon.com, one for twitter.com, one for adobe.com, and so on. Each website’s special Password Changer recipe has been written (and maintained) by our lovely employees.
Finally, we have an animator, who plays the role of a sous chef, or chef’s assistant” who has the responsibility to “do the work” on the website itself and report the result to the engine(the chef).

Have you followed so far? Let’s look at the technical details.

The entire logic of the engine is implemented in JS across all platforms. On Android, this means that a web view is required to run it.

This means that we end up having two distinct web views:

The first web view embeds the password changer engine which will talk to the client (Android, iOS, web extension, etc..). It takes the JSON recipe for the website and executes it using our cross-platform implementation.
The second web view is an animator which loads the website and executes on it what the engine wants to do, then reports the result.

The client application is informed of what is happening during the whole password change process.

Photo by Trường Trung Cấp Kinh Tế Du Lịch Thành Phố Hồ Chí Minh CET on Unsplash

Staying anonymous and secure

We know that you want your password to be changed for a stronger one, but we also know that you want us to do it securely.

That’s why when it’s time to retrieve any password changer recipe for a given website, we actually download a book (pack) containing multiple recipes which are all ciphered.

This way, only the local client can know which credential you want to change. This is the first and last time our server will play any role in the process.

Let’s change your password now

The rest of the password changer process is done entirely locally on the client. Yes, you got it, it’s homemade!

The password changer recipe describes, for each supported website, the list of actions to perform on the page in order to successfully change the password, using HTML selectors.

Here’s a simplified example of a recipe:

{
    "site": "archive.org",
    "steps": [
        {
            "step": "signin",
            "actions": [
                {
                    "type": "url",
                    "src": "https://archive.org/account/login.php"
                },
                {
                    "type": "set",
                    "selector": "[name=\"username\"]",
                    "value": "%JOB.EMAIL%"
                },
                {
                    "type": "set",
                    "selector": "[name=\"password\"]",
                    "value": "%JOB.PASS%"
                },
                {
                    "type": "click",
                    "selector": "[name=\"submit-to-login\"]"
                }
            ],
            ...
        },
    ],
    ...
}

Edge cases and challenges

Today we’re used to having websites ask to verify our identities when attempting to either login or change a password on a website. This can happen in various ways: by sending a code through email, SMS or an authenticator app, or asking you to resolve a challenge such as the famous captchas we all love. They might tell you to click boxes in an image as you “select all images with bicycles” or request that you click a box to prove “I’m not a robot.”

In our password changer recipe, we call these ingredients userPrompts. We can detect these prompts at any step of the process, so we can pause what we are doing and let you answer the question.

Luckily enough, because most of time we know you and your tastes, we can answer the website question for you using the OTP information stored in your Dashlane app, so you merely need to click on a single button. Presto!

Quality assurance and monitoring

Chefs and food critics alike taste the dishes at restaurant to see if the restaurant deserves a Michelin star. At Dashlane, our Engineering and QA teams ensure we thoroughly test our code and that password changer recipes work properly.

For a simple password changer recipe, it’s tested automatically every night by our Continuous Integration (CI), but we still need manual testing for some edge cases. For example, some websites will randomly ask you to solve a captcha, whereas others might just block your account when you attempt a password change too many times.

Finally, we have developed an alert system that allows our team react as fast as possible when a recipe is broken. All of this, of course, happens without breaking our zero-knowledge architecture principles.

Photo by Nathan Dumlao on Unsplash

What’s next

We are excited by how much this new password changer feature will save our users’ time and simplify their lives online. We think it’s the best thing since sliced bread 😉.

As you can imagine, the concept of using recipes for changing passwords on websites could be extended past just changing passwords. After all, recipes are just a set of processes for doing anything on a website. So, don’t be surprised if you see some new features in the future based on the same technology.

The future is promising! For today, we encourage you to use the new password changer tool on your favorite device. Bon appétit!

Originally published at https://blog.dashlane.com on March 11, 2021.