DEV Community

Cover image for How to Develop a Wordle Game using TDD in 25 Minutes
Maxi Contieri
Maxi Contieri

Posted on • Edited on • Originally published at maximilianocontieri.com

How to Develop a Wordle Game using TDD in 25 Minutes

Everybody is playing Worldle these days...

And I love TDD.

So, let's get moving...

TL;DR: With just a few steps we can build a robust Worldle.

Defining a word

The minimum information amount in Wordle is a word.

We can argue that letter is smaller, but we think all needed letter protocol is already defined (we might be wrong).

A word is not a string. This is a common mistake and a bijection violation.

A word and a string have different responsibilities, though they might intersect.

Mixing (accidental) implementation details with (essential) behavior is a very common mistake.

So we need to define what is a word.

A word in Wordle is a valid 5 letter word.

Let's start with our happy path:

<?php

namespace Wordle;

use PHPUnit\Framework\TestCase;

final class WordTest extends TestCase {
    public function test01ValidWordLettersAreValid() {
        $wordleWord = new Word('valid');
        $this->assertEquals(['v', 'a', 'l', 'i', 'd'], $wordleWord->letters());
    }
}
Enter fullscreen mode Exit fullscreen mode

We assert that prompting for letters in 'valid' returns an array with the letters.

Notice

  • Word class is not defined yet.
  • We don't care about letter sorting. That would be a premature optimization and gold plating scenario.
  • We start with a simple example. No duplicated.
  • We don't mess with word validation yet (word might be XXXXX).
  • We can start with a simpler test just validation word is created. This would violate the test structure that always requires an assertion.
  • Expected value should always be first.

We get an error:

Error : Class "Wordle\Word" not found

This is good in TDD, We are exploring our domain.

We need to create a Word with the constructor and the letters() function.

<?php

Namespace Wordle;

final class Word {

    function __construct(string $letters) {
    }

    function letters(): array {
        return ['v', 'a', 'l', 'i', 'd'];
    }
}
Enter fullscreen mode Exit fullscreen mode

Notice

  • We don't need anything to do with the constructor parameter
  • We hardcode letters function since this is the simplest possible solution up to now. -- Fake it till we make it.
  • Classes are final to avoid subclassification.

We run all the tests (just 1) and we are OK.

OK (1 test, 1 assertion)

Let's write another test:

<?php 

  public function test02FewWordLettersShouldRaiseException() {
        $this->expectException(\Exception::class);
        new Word('vali');
  }
Enter fullscreen mode Exit fullscreen mode

Notice

  • PHPUnit exception raising is not very good. We just declare an exception will be raised.

Test fails...

Failed asserting that exception of type "Wordle\Exception" is thrown.

We need to change our implementation in order to make test02 pass (and also test01)

<?php 

  public function test02FewWordLettersShouldRaiseException() {
        $this->expectException(\Exception::class);
        new Word('vali');
  }
Enter fullscreen mode Exit fullscreen mode

Notice

  • We just check for few letters. not for too many since we don't have yet a covering test.
  • TDD requires full coverage. Adding another check without a test is a technique violation.
  • We just raise a generic Exception. Creating special exceptions is a code smell that pollutes namespaces. (unless we catch it, but this is not happening right now).

Let's check for too many

<?php 
  public function test03TooManyWordLettersShouldRaiseException() {
        $this->expectException(\Exception::class);
        new Word('toolong');
  }
Enter fullscreen mode Exit fullscreen mode

Test fails as expected. Let's correct it.

Failed asserting that exception of type "Exception" is thrown.

<?php

function __construct(string $letters) {
        if (strlen($letters) < 5)
            throw new \Exception('Too few letters. Should be 5');
        if (strlen($letters) > 5)
            throw new \Exception('Too many letters. Should be 5');
}
Enter fullscreen mode Exit fullscreen mode

And all tests passed.

OK (3 tests, 3 assertions)

We can now make an (optional) refactor and change the function to assert for a range instead of two boundaries.
We decide to leave this way since it is more declarative.

We can also add a test checking for zero words following Zombie methodology.
Let's do it.

<?php

  public function test04EmptyLettersShouldRaiseException() {
        $this->expectException(\Exception::class);
        $wordleWord = new Word('');
  }
Enter fullscreen mode Exit fullscreen mode

it is no surprise test passes since we already have a test covering this scenario.
As this test adds no value we should remove it.

Let's check now what is a valid letter:

<?php

  public function test05InvalidLettersShouldRaiseException() {
        $this->expectException(\Exception::class);
        $wordleWord = new Word('vali*');
  }
Enter fullscreen mode Exit fullscreen mode

... and test is broken since no assertion is raised.

Failed asserting that exception of type "Exception" is thrown.

We need to correct the code...

<?php

  function __construct(string $letters) {
       if (str_contains($letters,'*')) {
          throw new \Exception('word contain invalid letters');
  }
Enter fullscreen mode Exit fullscreen mode

And all tests pass since we are clearly hardcoding.

OK (5 tests, 5 assertions)

Let's add more invalid letters and correct the code.

<?php

  public function test06PointShouldRaiseException() {
        $this->expectException(\Exception::class);
        $wordleWord = new Word('v.lid');
  }

  //Solution

  function __construct(string $letters) {
        if (str_contains($letters, '.'))
            throw new \Exception('word contain invalid letters');
    ///....
  }
Enter fullscreen mode Exit fullscreen mode

Notice

  • We didn't write a more generic function (yet) since we cannot correct tests and refactor at the same time (the technique forbids us).

All tests are ok.
We can refactor.
We replace the last two sentences 

<?php

  function __construct(string $letters) {
        if (!\preg_match('/^[a-z]+$/i', $letters)) {
            throw new \Exception('word contain invalid letters');
      }
    //..
Enter fullscreen mode Exit fullscreen mode

Notice

  • The assertion checks only for uppercase letters. Since we are dealing with these examples up to now.
  • We defer design decisions as much as possible.
  • We defined a regular expression based on English Letters. We are pretty sure it won't accept Spanish (ñ), german(ë), etc.

As a checkpoint, we have only five letters words from now on.

Lets assert on letters() function.
We left it hardcoded.
TDD Opens many paths.
We need to keep track of all of them until we open new ones.

We need to compare words

<?php  

  public function test07TwoWordsAreNotTheSame() {
        $firstWord = new Word('valid');
        $secondWord = new Word('happy');
        $this->assertNotEquals($firstWord, $secondWord);
  }

  public function test08TwoWordsAreTheSame() {
        $firstWord = new Word('valid');
        $secondWord = new Word('valid');
        $this->assertEquals($firstWord, $secondWord);
    }
Enter fullscreen mode Exit fullscreen mode

And test fails.
Let's use the parameter we are sending to them.

<?php

final class Word {

    private $setters;
    function __construct(string $letters) {
        if (!\preg_match('/^[a-z]+$/i', $letters)) {
            throw new \Exception('word contain invalid letters');
        }
        if (strlen($letters) < 5) {
            throw new \Exception('Too few letters. Should be 5');
        }
        if (strlen($letters) > 5) {
            throw new \Exception('Too many letters. Should be 5');
        }
        $this->letters = $letters;
    }

    function letters(): array {
        return ['v', 'a', 'l', 'i', 'd'];
    }
}
Enter fullscreen mode Exit fullscreen mode

Notice

  • We store the letters and this is enough for objects comparison (it might depend on the language).
  • letters() function is still hardcoded

Tests are OK

OK (8 tests, 8 assertions)

We add a different word for letters comparison

<?php

public function test09LettersForGrassWord() {
        $grassWord = new Word('grass');
        $this->assertEquals(['g', 'r', 'a', 's', 's'], $grassWord->letters());
    }
Enter fullscreen mode Exit fullscreen mode

And test fails.

Failed asserting that two arrays are equal.

It is very important to check for equality/inequality instead of assertTrue() since many IDEs open a comparison based on the objects.
This is another reason to use IDEs and never text editors.

Let's change the letters() function

<?php 

  function letters(): array {
        return str_split($this->letters);
  }
Enter fullscreen mode Exit fullscreen mode

Our words are in a bijection with English Worldle words. or not?

<?php

  public function test10XXXXIsnotAValidWord() {
        $this->expectException(\Exception::class);
        $wordleWord = new Word('xxxxx');
  }
Enter fullscreen mode Exit fullscreen mode

This test fails.
We are not trapping invalid English 5 letter words.

We need to make a decision. According to our bijection, there's an external dictionary asserting for valid words.

We can validate with the dictionary upon word creation. But we want the dictionary to store valid worlde words. Not strings.

It is an egg-chicken problem.

We decide to deal with invalid words in the dictionary and not the Worldle word.

We create new tests on our dictionary.

<?php

namespace Wordle;

use PHPUnit\Framework\TestCase;

final class DictionaryTest extends TestCase {
    public function test01EmptyDictionaryHasNoWords() {
        $dictionary = new Dictionary([]);
        $this->assertEquals(0, $dictionary->wordsCount());
    }
}
Enter fullscreen mode Exit fullscreen mode

Test fails since we have not defined our Dictionary.
We do it:

<?php

Namespace Wordle;

final class Dictionary {

    function __construct(array $words) {
        $this->words = $words;
    }

    function wordsCount(): int {
        return 0;
    }
}
Enter fullscreen mode Exit fullscreen mode

Notice

  • We don't do anything with the words yet.
  • We hardcode the number of words.
  • We faked it yet again.

We add another case for count 1 if the dictionary has one word.

<?php
  public function test02SingleDictionaryReturns1AsCount() {
        $words = [new Word('happy')];
        $dictionary = new Dictionary($words);
        $this->assertEquals(1, $dictionary->wordsCount());
   }
Enter fullscreen mode Exit fullscreen mode

Test fails as expected

Failed asserting that 0 matches expected 1.

We correct it.

<?php

final class Dictionary {

    private $words;
    function __construct(array $words) {
        $this->words = $words;
    }

    function wordsCount(): int {
        return count($this->words);
    }
}
Enter fullscreen mode Exit fullscreen mode

Notice

  • Dictionary is immutable
  • No Setters or getters

We start with inclusion and get an error.

Error : Call to undefined method Wordle\Dictionary::includesWord()

So we fake it.

<?php
public function test03DictionaryDoesNotIncludeWord() {
        $words = [new Word('happy')];
        $dictionary = new Dictionary($words);
        $this->assertFalse($dictionary->includesWord(new Word('sadly')));
    }


//the solution
function includesWord(): bool {
        return false;
    }
Enter fullscreen mode Exit fullscreen mode

We add a positive case.
And we need to correct the function instead of hardcoding it.

<?php 

public function test04DictionaryIncludesWord() {
        $words = [new Word('happy')];
        $dictionary = new Dictionary($words);
        $this->assertTrue($dictionary->includesWord(new Word('happy')));
    }

function includesWord(Word $subjectToSearch): bool {
        return in_array($subjectToSearch, $this->words);
    }
Enter fullscreen mode Exit fullscreen mode

We have the dictionary working.

Let's create the game.

<?php

final class GameTest extends TestCase {
    public function test01EmptyGameHasNoWinner() {
        $game = new Game();
        $this->assertFalse($game->hasWon());
    }
}
Enter fullscreen mode Exit fullscreen mode

Test fails.
We need to create the class and the function.

<?php

Namespace Wordle;

final class Game {

    function __construct() {
    }

    function hasWon(): bool{
        return false;
    }

}
Enter fullscreen mode Exit fullscreen mode

We implement words tried.
And the simplest solution

<?php

public function test02EmptyGameHasNoWinner() {
        $game = new Game();
        $this->assertEquals([], $game->wordsTried());
    }

//and the model

function wordsTried(): array {
        return [];
    }
Enter fullscreen mode Exit fullscreen mode

Let's try some words.
We get

Error : Call to undefined method Wordle\Game::addtry()

We define it.

<?php

public function test03TryOneWordAndRecordIt() {
        $game = new Game();
        $game->addtry(new Word('loser'));
        $this->assertEquals([new Word('loser')], $game->wordsTried());
    }

//The solution

final class Game {

    private $wordsTried;
    function __construct() {
        $this->wordsTried = [];
    }

    function addTry(Word $trial) {
        return $this->wordsTried[] = $trial;
    }

    function wordsTried(): array {
        return $this->wordsTried;
    }
}
Enter fullscreen mode Exit fullscreen mode

Notice

  • We store the trials locally and add the trial and also change wordsTried() real implementation.

We can implement hasLost() if it misses 5 trials.
With the simplest implementation as usual.

<?php

public function test04TryOneWordAndDontLooseYet() {
        $game = new Game();
        $game->addtry(new Word('loser'));
        $this->assertFalse($game->hasLost());
    }

//the solution
 function hasLost(): bool {
        return false;
    }
Enter fullscreen mode Exit fullscreen mode

As always. Me stop faking it and decide to make it.

'''Failed asserting that false is true.'''
So we change it as below.

<?php
  public function test05TryFiveWordsLoses() {
        $game = new Game();
        $game->addtry(new Word('loser'));
        $game->addtry(new Word('loser'));
        $game->addtry(new Word('loser'));
        $game->addtry(new Word('loser'));
        $this->assertFalse($game->hasLost());
        $game->addtry(new Word('loser'));
        $this->assertTrue($game->hasLost());
    }
'''

//The code
function hasLost(): bool {
        return count($this->wordsTried) > 4;
    }
Enter fullscreen mode Exit fullscreen mode

We have most of the mechanics.
Let's add the dictionary and play invalid

<?php

    public function test06TryToPlayInvalid() {
        $words = [new Word('happy')];
        $dictionary = new Dictionary($words);
        $game = new Game($dictionary);
        $this->expectException(\Exception::class);
        $game->addtry(new Word('xxxx'));
    }
Enter fullscreen mode Exit fullscreen mode

We need to pass the dictionary to fix the tests

<?php

final class Game {

    private $wordsTried;
    private $dictionary;
    function __construct(Dictionary $validWords) {
        $this->dictionary = $validWords;
        $this->wordsTried = [];
    }

    function addTry(Word $trial) {
        if (!$this->dictionary->includesWord($trial)){
            throw new \Exception('Word is not included ' . $trial);
        }
        return $this->wordsTried[] = $trial;
    }
}
Enter fullscreen mode Exit fullscreen mode

Fixed.

Now, we play to win

<?php
  public function test07GuessesWord() {
        $words = [new Word('happy')];
        $dictionary = new Dictionary($words);
        $winnerWord = new Word('happy');
        $game = new Game($dictionary, $winnerWord);
        $this->assertFalse($game->hasWon());
        $game->addtry(new Word('happy'));
        $this->assertTrue($game->hasWon());
    }
Enter fullscreen mode Exit fullscreen mode

We need to correct hasWon().

<?php

  private $winnerWord;
    function __construct(Dictionary $validWords, Word $winnerWord) {
        $this->dictionary = $validWords;
        $this->wordsTried = [];
        $this->winnerWord = $winnerWord;
    }

    function hasWon(): bool {
        return in_array($this->winnerWord, $this->wordsTried);
    }
Enter fullscreen mode Exit fullscreen mode

Notice

  • We use no flags to check if someone has words. We can directly check it.
  • We make an addParameter refactor with this new element to previous game definitions.

We added winnerWord.
We need to assert this word is in the dictionary.

<?php 
 public function test08WinnerWordNotInDictionary() {
        $words = [new Word('happy')];
        $dictionary = new Dictionary($words);
        $winnerWord = new Word('heros');
        $this->expectException(\Exception::class);
        $game = new Game($dictionary, $winnerWord);
    }

//and add the check...

function __construct(Dictionary $validWords, Word $winnerWord) {
        if (!$validWords->includesWord($winnerWord)){
            throw new \Exception('Winner word must be in dictionary');
        }
Enter fullscreen mode Exit fullscreen mode

OK (8 tests, 10 assertions)

We have all the mechanics.

Let's add the letter's positions.
We can do it in Word class.

<?php
public function test10NoMatch() {
        $firstWord = new Word('trees');
        $secondWord = new Word('valid');
        $this->assertEquals([], $firstWord->matchesPositionWith($secondWord));
    }


//This method in Word class

 function matchesPositionWith(Word $anotherWord) : array {
        return [];
    }
Enter fullscreen mode Exit fullscreen mode

Test passes

OK (10 tests, 10 assertions)

Let's match

<?php
  public function test11MatchesFirstLetter() {
        $firstWord = new Word('trees');
        $secondWord = new Word('table');
        $this->assertEquals([1], $firstWord->matchesPositionWith($secondWord));
    }
Enter fullscreen mode Exit fullscreen mode

Fails.

We need to define it better

<?php
function matchesPositionWith(Word $anotherWord) : array {
        $positions = [];
        for ($currentPosition = 0; $currentPosition < count($this->letters()); $currentPosition++){
            if ($this->letters()[$currentPosition] == $anotherWord->letters()[$currentPosition]) {
                $positions[] = $currentPosition + 1; //Humans start counting on 1
                //We can implement this better in several other languages
            }
        }
        return $positions;
    }
Enter fullscreen mode Exit fullscreen mode

We keep running all the test all the time

OK (23 tests, 25 assertions)

We can add a safety test to be more declarative

<?php

public function test12MatchesAllLetters() {
        $firstWord = new Word('trees');
        $secondWord = new Word('trees');
        $this->assertEquals([1, 2, 3 , 4 ,5], $firstWord->matchesPositionWith($secondWord));
    }
Enter fullscreen mode Exit fullscreen mode

Now we need the final steps. Matching in incorrect positions.
and always the simplest solution...

<?php
public function test13MatchesIncorrectPositions() {
        $firstWord = new Word('trees');
        $secondWord = new Word('drama');
        $this->assertEquals([2], $firstWord->matchesPositionWith($secondWord));
        $this->assertEquals([], $firstWord->matchesIncorrectPositionWith($secondWord));
    }

//the easy solution
function matchesIncorrectPositionWith(Word $anotherWord) : array {
        return [];
    }
Enter fullscreen mode Exit fullscreen mode

A more spicy test case.
Let's go for the implementation

<?php
public function test14MatchesIncorrectPositionsWithMatch() {
        $firstWord = new Word('alarm');
        $secondWord = new Word('drama');
        $this->assertEquals([3], $firstWord->matchesPositionWith($secondWord));
        $this->assertEquals([1, 4, 5], $firstWord->matchesIncorrectPositionWith($secondWord));
        //A*ARM vs *RAMA
        $this->assertEquals([3], $secondWord->matchesPositionWith($firstWord));
        $this->assertEquals([2, 4, 5], $secondWord->matchesIncorrectPositionWith($firstWord));
    }

// The complicated solution

function matchesIncorrectPositionWith(Word $anotherWord) : array {
        $positions = [];
        //count($this->letters() is always 5 but we don't want to add a magic number here
        for ($currentPosition = 0; $currentPosition < count($this->letters()); $currentPosition++){
            if (in_array($this->letters()[$currentPosition], $anotherWord->letters())) {
                $positions[] = $currentPosition + 1; //Humans start counting on 1
                //We can implement this better in several other languages
            }
        }
        return array_values(array_diff($positions, $this->matchesPositionWith($anotherWord)));
    }
Enter fullscreen mode Exit fullscreen mode

We remove from the occurrences the exact matches.

OK (26 tests, 32 assertions)

That's it.
We have implemented a very small model with all meaningful rules.

Future Steps

A good model should endure requirements change.

In the following articles, we will make these enhancements also using TDD:

  • Manage different languages and characters.

  • Import the words from a text file.

  • Add a Visual Engine and host it.

  • Implement a Absurdle

  • Develop a machine-learning algorithm to minimize wordle moves.

Repository

You can have all the code (and make pull requests on GitHub)

Conclusion

TDD is an iterative methodology. If you find some missing functionality you can write me on twitter and we will add it (after a failing test case, of course).

Hope you like this article and enjoy playing Worldle!

Top comments (2)

Collapse
 
michelc profile image
Michel •

Merci. Very interesting explanations.

I understand now why I spent almost 10 hours on mine :)

michelc

LeMOT to play WORDLE in French

Michel ・ Jan 11 ・ 3 min read

#javascript #webdev #gamedev
Collapse
 
mcsee profile image
Maxi Contieri •

haha. Next step will be internationalization. It has its own difficulties

Read next

aaronblondeau profile image

Geospatial Indexing Sampler

aaronblondeau -

daksh_kataria_9c4197f3f7c profile image

Cybersecurity Roadmap for 2025: Skills, Trends, and Career Pathways

Daksh Kataria -

pansychurch6 profile image

Software Development and THAT Outsourcing: Essential Insights

Levesque Ford -

aashima_bhatia_afe9bd3119 profile image

Allows Users to schedule appointments with a doctor

aashima bhatia -