25 + 5 project . several tests still not passing

[agate]

Hi all.

I deleted this as it was irrelevant and might confuse people.

My question is the last post .

Thanks

[lasjorg]

From your code:

defaultBreak : ++defaultState.defaultBreak, //should be  defaultBreak : defaultState.defaultBreak - 1  , but it breaks

It should be

defaultBreak : state.defaultBreak + 1

You are still using the initial state object, leave it alone. Use the state inside the reducer.

You are still mutating state in a lot of places. This is one of the hard parts of Redux, learning how to avoid state mutation. Again, my advice is to take some more time to learn Redux. Do some simple tutorials, then make some simple projects where you use Redux. After you have learned more about Redux, re-apply what you have learned to this project.

The way I see it, you are not making a 25 + 5 clock, you are learning about React and Redux. So focus on learning.

[agate]

oh oke , I not do defaultState but state. I’ll try that.

[lasjorg]

Look you can’t brute force this. You are going to have to spend more time learning about Redux, there is just no way around it.

Remember it’s just a tool. Some people hate Redux but they have to work with it because the project (their work) requires it. This project does absolutely not require Redux, so if you do want to use Redux, you are just going to have to learn more about it first.

---

Edit: BTW, I don’t mean you shouldn’t use this thread to ask for help, you totally should (please do). But it will be much better after you spend a little more time learning about the tools you are using.

[agate]

I will, any particular tutorial that would be helpful for not changing state ? I off course read/did FCC tutorials, some youtube tutorials,etc, but it’s probably limited.

I don’t particularly like the redux/react.org site.

[lasjorg]

Well, the Redux site is the official docs so you can’t really get closer to the source than that. I would suggest you read through the writing-reducers part at least. If you have not checked out the site lately it has been updated and is better than it used to be.

Dan Abramov has some free videos on egghead.io that gives a good introduction.

Fundamentals of Redux Course from Dan Abramov

Building React Applications with Idiomatic Redux

Programming with Mosh has a fairly comprehensive video on Redux which touches on some important concepts.

Redux Tutorial - Learn Redux from Scratch

Again, you do not have to use Redux for this project.

If I was to ask you to write this app in just React do you think you would be able to do it? Do you understand normal state management in React well enough? Because if not, throwing Redux in the mix is not going to make it any easier.

---

Just as an aside, and not to pile more wood on the fire, but just as a friendly FYI.

I would suggest using a coding environment that is better geared to React and Redux. Check out CodeSandbox it’s so much better for this kind of work and a lot more like working locally inside a real code editor. It has much better error handling and the starter React template is based on create-react-app.

Personally, I really do not like Codepen for React and I have seen it swallow errors that should result in the code failing to compile, the error handling/feedback is just very lacking on Codepen.

[agate]

Thanks , I will look into codesandbox as well

[agate]

Hi all.
So, I’ve made some changes to my code, but it’s still not passing all tests.
These are the errors I’m getting:

1. When I click the element with the id of “reset”, any running timer should be stopped, the value within id=“break-length” should return to 5, the value within id=“session-length” should return to 25, and the element with id=“time-left” should reset to it’s default state.

Timer has not reached 00:00.

12. When a session countdown reaches zero (NOTE: timer MUST reach 00:00), and a new countdown begins, the element with the id of “timer-label” should display a string indicating a break has begun.

Timer has not reached 00:00.

14. When a break countdown reaches zero (NOTE: timer MUST reach 00:00), and a new countdown begins, the element with the id of “timer-label” should display a string indicating a session has begun.

Timer has not reached 00:00

I’ve also noticed that it takes forever to run the tests, and that there are several red times marked. I don’t know if that is a problem or not, or maybe it’s because of these errors I’m getting?

Ignoring the audio right now as I’m not done with that yet.

codepen

i’d just like to know if I’m on the right track, some hints or so
Thanks

[lasjorg]

1. You do not want to overwrite the state, just return a new copy.

2. I would suggest you use the more common syntax of returning the state object with the old state spread in and whatever updates are needed.

3. Move the if logic out of the reducer into handler functions so the dispatch is only called if the condition is met.

case INCBREAK:
  return {
    ...state,
    defaultBreak: state.defaultBreak + 1
  }

handleBreakIncrement = () => {  
  if(this.props.clock.defaultBreak < 60) {
    this.props.breakIncrement()
  }
}

onClick={this.handleBreakDecrement}

[agate]

Thanks, those changes make total sense.
I did see it done somewhere state = object.assign() etc and then state was returned, but it does technically still overwrite state as it’s assigning to state. thanks

[agate]

I now only have more errors.

1. When I click the element with the id of “reset”, any running timer should be stopped, the value within id=“break-length” should return to 5, the value within id=“session-length” should return to 25, and the element with id=“time-left” should reset to it’s default state.

Timer has not reached 00:00. ‘Session\n25:00\nstart/pausereset’

10. If the timer is running and I click the element with id=“start_stop”, the countdown should pause.

25 + 5 has started but time displayed is not changing: expected ‘00’ to not equal ‘00’

12. When a session countdown reaches zero (NOTE: timer MUST reach 00:00), and a new countdown begins, the element with the id of “timer-label” should display a string indicating a break has begun.

Timer has not reached 00:00.

14. When a break countdown reaches zero (NOTE: timer MUST reach 00:00), and a new countdown begins, the element with the id of “timer-label” should display a string indicating a session has begun.

Timer has not reached 00:00.

None of these errors are making sense when I test the timer it seems to work correctly. I’m at a loss once again. It’s very hard to know how to fix it if don’t even see the errors.
Hope someone is willing to help , yet again !

[agate]

it’s almost as if there’s two timers running and that’s causing a problem, but i’m sure there’s only one timerId set and cleared.
I’m hoping the problem is very minor at this point, and I can finish this project soon. Thanks

I’m at a loss still what’s causing the tests to fail.
Hope someone has some insight , just a clue with be very helpful

[agate]

These are the errors now.

1. When I click the element with the id of “reset”, any running timer should be stopped, the value within id=“break-length” should return to 5, the value within id=“session-length” should return to 25, and the element with id=“time-left” should reset to it’s default state.

Default timer label was not properly reset : expected ‘Break\n25:00\nstart/pausereset’ to equal ‘Session\n25:00\nstart/pausereset’

9. If the timer is running, the element with the id of “time-left” should display the remaining time in mm:ss format (decrementing by a value of 1 and updating the display every 1000ms).

25 + 5 clock has started but time displayed is not changing : expected 0 to be above 0 AssertionError: 25 + 5 clock has started but time displayed is not changing : expected 0 to be above 0

10. If the timer is running and I click the element with id=“start_stop”, the countdown should pause.

25 + 5 has started but time displayed is not changing: expected ‘00’ to not equal ‘00’ AssertionError: 25 + 5 has started but time displayed is not changing: expected ‘00’ to not equal ‘00’

12. When a session countdown reaches zero (NOTE: timer MUST reach 00:00), and a new countdown begins, the element with the id of “timer-label” should display a string indicating a break has begun.

Timer has not reached 00:00. Error: Timer has not reached 00:00.

13. When a session countdown reaches zero (NOTE: timer MUST reach 00:00), a new break countdown should begin, counting down from the value currently displayed in the id=“break-length” element.

Timer has switched to Break time, but it didn’t start with the correct value.: expected 1 to equal 5

14. When a break countdown reaches zero (NOTE: timer MUST reach 00:00), and a new countdown begins, the element with the id of “timer-label” should display a string indicating a session has begun.

Timer has not reached 00:00.

It just doesn’t make sense the timer runs, the timer changes correctly , from what I see between sessions/breaks?
I just hate to waste so much time on this. I’m hoping someone is willing to take a look.

I know it’s more errors than before, but I made changes that logically to me make sense, as there are anyway still errors either way , I leave the changes.
Thanks