How To Implement Update Function In Elm Model — Tentamen Software Testing Blog

Image by from


In the previous post, we learned how to add an to our Picshare application. In this post, we will write the Picshare update function but heart icon will not be interactive yet. This post is part of the series, and it is based on a remarkable book, by Jeremy Fairbank.

Update Function

For now, we have in our Picshare application heart like button that does nothing when we click on it. For that, we need to implement an update function. The update function takes two arguments: message and model. It interprets the message and updates the model state. That model is returned to View method that update HTML of our application.

If you have some programming experience, you probably heard of if-then-else a construct that could be used in identifying message type. But Elm is a functional language, and we will introduce pattern matching construct.

Follow steps from 1. to 7. from this gist and compile the application:

Application build will fail:

Elm compile error for missing case pattern option

The root cause is comment number 7. case is missing an option for Unlike Msg Union option. Uncomment 7th comment and compile the Picshare application. Open index.html in the browser and check if the Heart is interactive. Still nothing. There is more work to do.


  • input parameters of the update function
  • pattern matching using case function

Originally published at on September 20, 2020.




Founder of Tentamen, software testing agency.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

“If it turns out that this is incurable, would you marry me?”

Real-Time Prediction of Credit Card Fraud deployed on AWS using Spark and XGBoost (Part III)

Building an E-commerce Website With ExpressionEngine, Part 1

HNG Internship goals for Utuk

Why startups need regression test automation to reduce risk

What is a Unit Test? Part 2: classical vs. London schools

Calculate how long your SSD lasts Chia plotting

TruePath-XPath on click

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Karlo Smid

Karlo Smid

Founder of Tentamen, software testing agency.

More from Medium

Poker — minimum defence frequency vs pot odds

Eagle : The Great Image Organiser

Rust; a look at the future

The Intersection Point