3 files changed, 89 insertions, 3 deletions
diff --git a/specs/Main.hs b/specs/Main.hs
index 4308669..91a9e5a 100644
--- a/specs/Main.hs
+++ b/specs/Main.hs
@@ -3,10 +3,12 @@ module Main (main) where
 import qualified Specs.AppEventSpec
 import qualified Specs.AppStateUpdateSpec
 import qualified Specs.KeySequenceSpec
+import qualified Specs.ViewSpec
 import Test.Hspec (hspec)
 
 main :: IO ()
 main = hspec $ do
-  Specs.KeySequenceSpec.test
-  Specs.AppStateUpdateSpec.test
   Specs.AppEventSpec.test
+  Specs.AppStateUpdateSpec.test
+  Specs.KeySequenceSpec.test
+  Specs.ViewSpec.test
diff --git a/specs/Mock.hs b/specs/Mock.hs
index c44aff3..d0daab1 100644
--- a/specs/Mock.hs
+++ b/specs/Mock.hs
@@ -8,6 +8,7 @@ import Control.Monad (void)
 import Control.Monad.IO.Class (MonadIO)
 import Control.Monad.State (MonadState (state), StateT (runStateT))
 import Data.Text (Text)
+import qualified Data.Text as Text
 import Foreign.C (CInt)
 import Test.Hspec
 
@@ -63,9 +64,12 @@ mockWindowOffsetX = 200
 mockWindowOffsetY :: CInt
 mockWindowOffsetY = 100
 
+mockTextWidth :: Int
+mockTextWidth = 10
+
 instance (MonadIO m) => MonadDraw (TestM m) where
   drawLine p1 p2 = registerMockCall $ CallDrawLine p1 p2
-  drawText p color text = (0, 0) <$ registerMockCall (CallDrawText p color text)
+  drawText p color text = (fromIntegral $ mockTextWidth * Text.length text, 0) <$ registerMockCall (CallDrawText p color text)
   drawCircle radius p = registerMockCall $ CallDrawCircle radius p
   setDrawColor color = registerMockCall $ CallSetDrawColor color
   windowSize = (mockWindowWidth, mockWindowHeight) <$ registerMockCall CallWindowSize
diff --git a/specs/Specs/ViewSpec.hs b/specs/Specs/ViewSpec.hs
new file mode 100644
index 0000000..62b49fd
--- /dev/null
+++ b/specs/Specs/ViewSpec.hs
@@ -0,0 +1,80 @@
+module Specs.ViewSpec where
+
+import Chelleport.Config
+import Chelleport.Types
+import Chelleport.View
+import Mock
+import Test.Hspec
+
+test :: SpecWith ()
+test = do
+  let defaultState =
+        State
+          { stateKeySequence = [],
+            stateIsShiftPressed = False,
+            stateIsMatched = False,
+            stateGrid = [["ABC", "DEF"], ["DJK", "JKL"]],
+            stateIsDragging = False
+          }
+  let drawTextCalls = filter (\case CallDrawText {} -> True; _ -> False) . calls
+
+  describe "#render" $ do
+    context "when key sequence is empty" $ do
+      let currentState = defaultState {stateKeySequence = ""}
+
+      it "draws matching text labels" $ do
+        (_, mock) <- runWithMocks $ render currentState
+        drawTextCalls mock
+          `shouldBe` [ CallDrawText (460, 10) colorWhite "ABC",
+                       CallDrawText (1420, 10) colorWhite "DEF",
+                       CallDrawText (460, 550) colorWhite "DJK",
+                       CallDrawText (1420, 550) colorWhite "JKL"
+                     ]
+
+    context "when there is a partial match" $ do
+      let currentState = defaultState {stateKeySequence = "D"}
+
+      it "draws matching text labels" $ do
+        (_, mock) <- runWithMocks $ render currentState
+        drawTextCalls mock
+          `shouldBe` [ CallDrawText (1420, 10) colorLightGray "D",
+                       CallDrawText (1430, 10) colorAccent "EF",
+                       CallDrawText (460, 550) colorLightGray "D",
+                       CallDrawText (470, 550) colorAccent "JK"
+                     ]
+
+    context "when key sequence is complete match" $ do
+      let currentState = defaultState {stateKeySequence = "DEF"}
+
+      it "draws only the matching label" $ do
+        (_, mock) <- runWithMocks $ render currentState
+        drawTextCalls mock `shouldBe` [CallDrawText (1420, 10) colorLightGray "DEF"]
+
+  describe "#renderKeySequence" $ do
+    context "when there is a partial match" $ do
+      it "draws the matched section and highlights the remaining characters" $ do
+        (_, mock) <- runWithMocks $ renderKeySequence "ABC" "ABCDE" (0, 0)
+        calls mock
+          `shouldBe` [CallDrawText (0, 0) colorLightGray "ABC", CallDrawText (3 * 10, 0) colorAccent "DE"]
+
+      it "return true as the text is visible" $ do
+        (isVisible, _) <- runWithMocks $ renderKeySequence "ABC" "ABCDE" (0, 0)
+        isVisible `shouldBe` True
+
+    context "when there is no input key sequence" $ do
+      it "draws text as a single chunk" $ do
+        (_, mock) <- runWithMocks $ renderKeySequence "" "ABCD" (0, 0)
+        calls mock `shouldBe` [CallDrawText (0, 0) colorWhite "ABCD"]
+
+      it "return true as the text is visible" $ do
+        (isVisible, _) <- runWithMocks $ renderKeySequence "" "ABCD" (0, 0)
+        isVisible `shouldBe` True
+
+    context "when key sequence does not match" $ do
+      it "does not draw text" $ do
+        (_, mock) <- runWithMocks $ renderKeySequence "AXY" "ABCD" (0, 0)
+        calls mock `shouldBe` []
+
+      it "return false as the text is not visible" $ do
+        (isVisible, _) <- runWithMocks $ renderKeySequence "AXY" "ABCD" (0, 0)
+        isVisible `shouldBe` False