dwyl / learn-tdd Goto Github PK

Not that there's much code to check, but just to give people an idea of what badges to look for...

Codecov is clearly _betterer_ than the previous coverage tracker...
@stevepeak wouldn't you agree...? 😜

The "What Next?" section of this tutorial currently points to more testing-related tutorials:
https://github.com/dwyl/learn-tdd/tree/e47f1636bee3cba40d8c89f5755c4275fd0bc8d2#what-to-learn-next

The "Learn Elm Architecture" tutorial: https://github.com/dwyl/learn-elm-architecture-in-javascript
helps people practice the TDD skills/workflow while learning something else I suggest we add a link to it so people can continue practicing.

According to the QUnit documentation the current way to run a test is like this:

QUnit.test('This sample test should always pass!', function(assert) {
        var result = 1 + 1;
        assert.equal(result, 2); // just so we know everything loaded ok
      });

As opposed to this:

 test('This sample test should always pass!', function(assert) {
        var result = 1 + 1;
        assert.equal(result, 2); // just so we know everything loaded ok
      });

Could we update the QUnit script from this (QUnit 1.18.0):

<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-1.18.0.css">

to this (QUnit 2.1.1):

<script src="https://code.jquery.com/qunit/qunit-2.1.1.js"></script>

The examples would also need to be changed.

How about adding standard-js as a Bonus feature as well.
Following JS Standards from standardjs
and getting that StandarJs Following badge for consistency.

❇️ ❇️ ❇️ ❇️ ❇️ ❇️ ❇️

var result = [1,2,3].indexOf(1); // this should be 1

should be

var result = [1,2,3].indexOf(1); // this should be 0

At present we are advising people to install live-server: https://github.com/dwyl/learn-tdd#live-server
but if they do not have a package.json in their working directory the --save will fail and thus it will not start! we need to check this and add additional instructions as necessary...

As a person who is new to the DWYL Org/Community 🆕
I need to know how to contribute to the project effectively 💭
so that I can start my journey towards Doing What I Love with my Life! ❤️ ✅ 😂

Markdown:

_**Please read** our_
[**contribution guide**](https://github.com/dwyl/contributing)
(_thank you_!)

Note: these are line-separated but in the actual rendered page it's all one line.
see: https://github.com/dwyl/contributing/blob/master/CONTRIBUTING.md

5 minute bonus level?

Hi Guys! Awesome work with this tutorial.

I'd just like to report this little typo in the second test case, which occours on sections Try it Yourself and Blanket.js:
The line
test('getChange(486, 500) should equal [100, 10, 2, 2]', function(assert) {
Should be
test('getChange(486, 600) should equal [100, 10, 2, 2]', function(assert) {

I'm going to submit a PR.

https://david-dm.org/dwyl/learn-tdd#info=devDependencies

https://nodesecurity.io/advisories/hapi_denial-of-service

@iteles as requested:

Let me know if you need more detail/info.
Thanks! ❤️

We are using Hapi.js as our static server using the directory handler:

but when we attempt to upgrade to hapi v9.x we get:

Error: Unknown handler: directory

full stack trace:

/Users/n/code/learn-tdd/node_modules/hapi/node_modules/hoek/lib/index.js:723
    throw new Error(msgs.join(' ') || 'Unknown error');
          ^
Error: Unknown handler: directory
    at Object.exports.assert (/Users/n/code/learn-tdd/node_modules/hapi/node_modules/hoek/lib/index.js:723:11)
    at Object.exports.defaults (/Users/n/code/learn-tdd/node_modules/hapi/lib/handler.js:105:14)
    at new module.exports.internals.Route (/Users/n/code/learn-tdd/node_modules/hapi/lib/route.js:48:35)
    at internals.Connection._addRoute (/Users/n/code/learn-tdd/node_modules/hapi/lib/connection.js:359:17)
    at internals.Connection._route (/Users/n/code/learn-tdd/node_modules/hapi/lib/connection.js:351:18)
    at internals.Plugin._apply (/Users/n/code/learn-tdd/node_modules/hapi/lib/plugin.js:497:14)
    at internals.Plugin.route (/Users/n/code/learn-tdd/node_modules/hapi/lib/plugin.js:470:10)
    at Object.<anonymous> (/Users/n/code/learn-tdd/static-server.js:3:8)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
13 Aug 19:11:49 - [nodemon] app crashed - waiting for file changes before starting...

Need to explain the anatomy of a test.

• test description?
• assertion
• assertion methods (e.g. equal, deepEqual - why do we need two? how are they different?)

Any particular reason why the getChange function was assigned to a variable? (I'm more used to the function getChange() way of defining JS functions.)

What does use scrict do, in small words?

The following link is dead:

Create a file called static-server.js and paste the code from learn-tdd/static-server.js into the file.

No one has any excuse not to do Test Driven Development (TDD) in their Web App anymore!

Nodemon is not required for running static-server as we don't have to reload server when HTML changes. Adding it introduces additional complexity into the guide. Perhaps we should drop it?

Everything will work just fine with running node static-server.js.
JSDoc and Istambul generate static HTML files, so refreshing browser is enough to see changes.

Sorry guys made a commit by accident to master (thought I was in a fork) 😖 , will try and revert this.

To help people who have found the tutorial useful spread the word we should include a sample tweet to make it as _easy as possible.

https://twitter.com/livelifelively/status/768645514120212480

Has anyone got a better tweet we can use?

Should we be encouraging people to use JSDoc?

No idea why this is not working... need to investigate which versions are compatible.

A few of us had trouble getting this to work this morning as we hadn't installed Istanbul globally. It might be worth changing the suggested command to ./node_modules/.bin/istanbul cover tests.js. This would make it similar to the live-server command in the previous section.

I can create a PR if you're happy with the change?

Does not affect any of the code or running of this tutorial.
but the badge looks really bad for people's _perception_:
https://david-dm.org/dwyl/learn-tdd#info=devDependencies

Asked by a member of LadiesWhoCode yesterday, but I did not note down her name...

Hi,

When I tried to install jsdoc by your instructions, it did not work. No html file was generated, and nothing happened when I tried to execute the subsequent commands. I believe that it has been replaced by jsdoc3. Please update this!

In the tutorial, in the coin section, there should be an image showing the coins used in the UK (labeled "GBP coins"), but it's a dead link. It points here, which you'll see returns "not found."

In the markdown, the image link is https://raw.githubusercontent.com/nelsonic/learn-mocha/master/images/gbp-coins.jpg. It appears that the repository at nelsonic/learn-mocha might have been moved to dwyl/learn-mocha, so the image link should be updated to https://github.com/dwyl/learn-mocha/blob/master/images/gbp-coins.jpg.

Should we include a section on running the tests server side?
(thus facilitating running these on Travis-CI)

Here are a few suggested corrections of typos and/or clarifications!

I fixed the typos as I went along so I have these in a file (stupidly I forgot to fork and just cloned - so used to working on organisation documents!! 😳 Happy to PR these in later today from a fork). I made the stuff below that I didn't change in that file bold so you can see what they are straight away.

• "solving the solution" ➡️ comes across as confusing, 'solving the problem', 'finding a solution' or 'solving for a solution' would all work better here
• "wihout a test" ➡️ "without"
• "abut" ➡️ "about"
• "faling" ➡️ "failing"
• "write the code require" ➡️ "required"
• "By having a clear question" ➡️ Capitalise 'By'
• I would possibly add 'no surprises, even when you're working with a big, inter-dependent code base' or something that gets people to understand that it's not 'wasted time'.
• "e.g: atom index.html" ➡️ suggest adding (which creates and opens the file in the Atom text editor if you have it installed)
• "So, back in our index.html" ➡️ Capitalise 'So'
• "We use Quint's" ➡️ QUnit
• Text on the image of blanket test coverage is doubled up: "bad code on a single line it will blanket will..."
• Sentence needs a full stop at the end
• I would add a one sentence explanation of what the code below these lines actually does here
• I would move this line to the top of this bulleted block as people will read the bullets as instructions and maybe go away and try to install them separately without using --save-dev, get to this line and think they've done it all wrong
• "roguge" ➡️ "rogue"
• "To quickly add CI support to your project." ➡️ punctuation; should be a : rather than a .
• "Note: the project will need to be hosted on GitHub" ➡️ Works much better when enclosed in brackets to separate it a little from the rest of the bullet
• Capitalise the first letters of the numbered list in bonus level 4 for consistency with the rest of the tutorial
• "lik" ➡️ "like"
• Capitalise the first letters of the unordered list in conclusion for consistency with the rest of the tutorial
• "descipline" ➡️ "discipline"
• Remove full stop at the end of the bullet in the middle of the bulleted list in the conclusion
• "if you have _any questions" ➡️ Capitalise "If"

I think dwyl's daydream and nightmare tutorial for automated testing would be very useful to add to the 'What to learn next' bullets.

Currently there is only a link to a Nightwatch tutorial for automated testing (alongside links for other testing types ie. test coverage/ node testing).

Do people think it's clearest to only suggest one automated testing resource rather than two? By this I mean Nightwatch vs Daydream and Nightmare (coupled together as a pair).

I think Daydream and Nightmare have the obvious advantage of being technically easy to implement which also helps to save time. Are there any specific benefits for suggesting Nightwatch (if so perhaps it would be good to add them to the description so readers can make an informed decision)?

https://github.com/dwyl/learn-tdd/blob/master/README.md#L14

I am assuming so?

Thanks!

In the live server section there needs to be a step letting you know that you need to tick the "Enable coverage" box as it is not ticked as default.

Seems like a little thing but it stumped us for a frustrating amount of time!

Came across https://github.com/jmonetti/tdd-for-humans today and slide #10 reminded me that we don't have a particularly good "User Story" in the Practical > Requirements section of this tutorial ... https://github.com/dwyl/learn-tdd#requirements we can do a much better job of getting people in to the habit of writing user stories ...

For reference this is the slide:

This format of slotting in the Who, What and Why makes it very clear to people.

At the end of the readme, should we add a "_What Next?_" section so people know what they should learn next.

The function under this headline "Keep Cheating or Solve the Problem?" references C.coins twice... I think the C should not be there...

See Bonus Level 2! 😜

Hi,

When I typed npm install qunitjs qunit-tap istanbul --save-dev in the command line, and then typed istanbul cover test.js, I got zsh: command not found: istanbul. However, when I typed node test.js, everything was fine. I already had Node installed, but did not have istanbul installed. This was my first attempt to do so. Is there a step missing here in the instanbul installment process? Also, fyi, you failed to tell people to npm init to create their package.json file. Perhaps you should include that. Also, not everyone has Node.js installed. At least direct them to where they can learn how to install it if they don't already have it installed. Otherwise, thanks so much for this intro to TDD!

Hi @nelsonic!

@finnhodgkin and I are mentoring Testing Week so we're currently going through all the workshops we did.

We're going to be switching from QUnit to Tape (as per this proposal), so we need to re-work lots of the existing material.

We love this workshop and think it's a great resource as it is, so we wouldn't really want to change it. The vending machine change challenge fits TDD really well, so we'd love to keep using the concept.

We're wondering if you'd be happy with us creating a new workshop inspired by this one, but trimmed down and using Tape instead?

Hi any plans for TTD in Ruby for beginners as well? 😄

https://david-dm.org/dwyl/learn-tdd#info=devDependencies

tidy up the readme and correct typos

Hi @nelsonic, in the TDD tutorial when you are writing the First Requirement dummy test. you have some code under "your index.html should now look like this:” In here the test has a function without assert being the argument.

So if one was to copy the code and then run the html file in the browser, it would fail with ReferenceError: assert is not defined.

See: https://david-dm.org/dwyl/learn-tdd#info=devDependencies
Need to update Hapi.js to Latest and remove codeclimate reporter

Could we display this more visually to be more engaging for people?

https://github.com/dwyl/learn-tdd/blame/d9d328b648a023634355e9cb407f2d3ff0dedfc4/README.md#L525-L535
is confusing people ... 😿

Tidy up the code and jshint it?

Bonus levels 2 & 3 Require Node.js, this is assumed but not mentioned explicitly.

The photograph used to illustrate a 'consistent and beautifully illustrated team' shows the Ferrari F1 pit crew in 2008. Given that the pit crew cost Felipe Massa the championship that year by failing to remove the fuel hose from his car during a refuelling stop at the Singapore GP, it may be worth using an image of a different pit crew. Red Bull are a safe bet.

https://github.com/dwyl/learn-tdd/blob/master/README.md#L14

I am assuming so?

Thanks!