avatarsimbu

Free AI web copilot to create summaries, insights and extended knowledge, download it at here

2536

Abstract

dn-images-1.readmedium.com/v2/resize:fit:800/1*kLPnN8Z3DGPimm3XbwNeDg.png"><figcaption>Unimplemented Step</figcaption></figure><p id="bd99">And a top level function to expose them.</p><figure id="66da"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*U3uNmnA0iBtuvXaBnj8RnQ.png"><figcaption>Exposing the themeSteps</figcaption></figure><p id="66dd">I then wired them up in the gherkin_feature_test.dart file:</p><figure id="600a"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*1y2R_vPOzxhkmgruXFK53A.png"><figcaption>Wire up new feature test and steps, so we can run and debug them.</figcaption></figure><p id="bf34">Run refresh features to complete the wiring using code generation:</p><figure id="0137"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*bm_XmTKkHrKF-UxXmB-cKw.png"><figcaption>Refresh feature launch item.</figcaption></figure><p id="f7d7">Then run the new feature tests:</p><figure id="1d09"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*RNOQsCNSoAXDRU9DGItghA.png"><figcaption>Running the new unimplemented feature test scenarios.</figcaption></figure><p id="706d">Wiring done, we can now write the new code to implement the tests and make them pass.</p><p id="7d18">Starting with a brief design:</p><figure id="d060"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*cVsacC5YyPIQGF2BjS_-iA.png"><figcaption>Simple design</figcaption></figure><h2 id="359f">Ta Da</h2><figure id="6793"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*Yw4at5et3AngQu-AHgw3Jg.gif"><figcaption>Adaptive theme feature tests on iPhone</figcaption></figure><figure id="516f"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*YREIN3EwzPWLl0F94955CQ.png"><figcaption>Console test report.</figcaption></figure><h2 id="feda">Code</h2><p id="90fb"><b>Application Changes</b></p><figure id="247e"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*vh1ZQhKdkx2-PvL8nP13Pg.png"><figcaption>Add methods to theme notifier to change theme brightness and whitelabel</figcaption></figure><figure id="b030"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*O-1LujF75RgFNzE5MXwTQw.png"><figcaption>Listen to device brightness changes and notify the theme provider of changes</figcaption></figure><p id="eba9">During implementation I decide that the settings provider was not required, it fine to change a design once the you get into the details and I would expect the design to be thrown away once the

Options

code is implemented as we now rely on the feature tests and the code we used to make the tests pass.</p><p id="7123"><b>Integration Step code examples</b></p><figure id="f3f6"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*i1TnD_KVeRO-v6FWv70-SA.png"><figcaption>New theme provider changeWhitelabel method</figcaption></figure><figure id="aeaa"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*ZunEvVGrXDueHjuVawaltw.png"><figcaption>New theme provider changeBrightness method</figcaption></figure><figure id="2594"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*nnERyAAYTHD-tYJyWysYow.png"><figcaption>Asserting theme has changed based on brightness and whitelabel state</figcaption></figure><h2 id="67e3">XP</h2><p id="8066">With interruptions and writing the blog that’s a days effort.</p><p id="5b6e">You may say that’s too much! I could have just coded it in an hour.</p><p id="8aee">That’s true but but it would likely be hard wired into a single widget build method and may have skipped the support of Whitelabel themes.</p><p id="8372">We now have code we can test and is documented by the tests.</p><p id="597d">That defends the feature from future regression caused by new features and documents the features in understandable way using English.</p><p id="0389">The bit of the discipline that annoys me the most is creating all the boilerplate code to wire up the feature statements into runnable steps.</p><p id="2cdb">I will be looking at scaffolding to help this soon, I know that the flutter_gherkin package has some pre-defined step definitions that use variables, so I will see what can be achieved, Kaizen!</p><figure id="924b"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*D83aPvMDcKLCco_KRS0FEw.png"><figcaption>Snippet from flutter_gherkin package documentation explaiing pre-defined steps</figcaption></figure><h2 id="cf07">Sound & Vision</h2><figure id="21a7"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*HcRFYzyZKvFti-BTxdWAnw.png"><figcaption>Songs from the big chair</figcaption></figure><h2 id="9446">Links</h2><ul><li><a href="https://cucumber.io/blog/bdd/example-mapping-introduction/">Introducing Example Mapping</a></li><li><a href="https://readmedium.com/switch-to-dark-mode-in-real-time-with-flutter-and-google-maps-f0f080cd72e9">Switch to Dark Mode in Real-Time</a></li><li><a href="https://www.kaizen.com/">Kaizen</a></li><li><a href="https://www.bddbooks.com">BDD Books</a></li></ul></article></body>

Join Medium to view all my articles.

Flutter — Discipline — New Feature

This is the first is a series of articles around disciplines.

They feel slow and sound harsh, but with good scaffolding and a bit of Kaizen (translate love) they are the key ingredient to focus and delivery speed.

My choice is to be feature driven, feature first, feature focused.

This article explains by example the disciplines used to add a new feature to the project.

Adaptive Theme Feature

Discipline Stages

Discovery

Business Requirement (Story)

Support automatic light and dark modes by changing the theme when the device brightness setting is changed.

Formulation

Specification using example mapping
Adpative Theme Feature test based on the specified examples

Automation

Start coding the steps and research and design as you go, when needed.

In this example we already have steps and code to detect devices and code to bring in themes and will need new steps for theme changes and phone settings.

Identifying new steps

To cover the new feature test statements I created three new *steps.dart files:

Adaptive theme feature file

Each has a series of unimplemented steps to connect the given, when, then feature test statements with the code.

Unimplemented Step

And a top level function to expose them.

Exposing the themeSteps

I then wired them up in the gherkin_feature_test.dart file:

Wire up new feature test and steps, so we can run and debug them.

Run refresh features to complete the wiring using code generation:

Refresh feature launch item.

Then run the new feature tests:

Running the new unimplemented feature test scenarios.

Wiring done, we can now write the new code to implement the tests and make them pass.

Starting with a brief design:

Simple design

Ta Da

Adaptive theme feature tests on iPhone
Console test report.

Code

Application Changes

Add methods to theme notifier to change theme brightness and whitelabel
Listen to device brightness changes and notify the theme provider of changes

During implementation I decide that the settings provider was not required, it fine to change a design once the you get into the details and I would expect the design to be thrown away once the code is implemented as we now rely on the feature tests and the code we used to make the tests pass.

Integration Step code examples

New theme provider changeWhitelabel method
New theme provider changeBrightness method
Asserting theme has changed based on brightness and whitelabel state

XP

With interruptions and writing the blog that’s a days effort.

You may say that’s too much! I could have just coded it in an hour.

That’s true but but it would likely be hard wired into a single widget build method and may have skipped the support of Whitelabel themes.

We now have code we can test and is documented by the tests.

That defends the feature from future regression caused by new features and documents the features in understandable way using English.

The bit of the discipline that annoys me the most is creating all the boilerplate code to wire up the feature statements into runnable steps.

I will be looking at scaffolding to help this soon, I know that the flutter_gherkin package has some pre-defined step definitions that use variables, so I will see what can be achieved, Kaizen!

Snippet from flutter_gherkin package documentation explaiing pre-defined steps

Sound & Vision

Songs from the big chair

Links

Flutter
Programming
Mobile
Bdd
Testing
Recommended from ReadMedium