learn-co-curriculum / konami-code-lab Goto Github PK

SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode

Pedro David Garcia Lopez (https://learn.co/LorryDriveloper) has passed the tests in the browser, but the test light does not turn green. He is using the desktop Learn IDE on Windows.

It took me a while to realize that you had press all of the keys in order, rather than just pressing any of the keys once. Maybe that could be explained more specifically that its each key in order rather than any of them.

but i make a alert in my own browser, why can't in here???

const code = [38, 38, 40, 40, 37, 39, 37, 39, 66, 65]
// ASCIIcode
let index = 0;
function init() {
  var body=document.querySelector('body');
  var keycodes = "";
  body.addEventListener('keydown', function(e){

    // keycodes += e.keyCode;  //record
    keycodes = e.keyCode;//record the keydown event code be entered
    //  var c = code.join('').slice(0,2*index + 2); //
  //  console.log(index);     //
    console.log(keycodes);  
  console.log(code[index]);
  // console.log(e.detail)
  // console.log(e.which)
  // console.log(e.location)

    if (keycodes == code[index]){     //if the order is right,index plus 1, otherwise reset  index 
        // alert('you did it!');
        index++;
        if (index == code.length) {alert('you get it ');
        index = 0;
        keycodes = '';
    }
    }else {
        index = 0;
        keycodes = '';
    }
  })
}
init();

expecting for your help, thx!

var key = parseInt(e.which || e.detail) does not pass the test for showing the alert as e.which is deprecatted.

It would probably be more friendly towards users who are learning if the content was updated to show the use of e.key instead to avoid confusion on where the problem is coming from.

var key = parseInt(e.key || e.detail);

Using Chrome version 57.0.2987.133

Inside a function onKeydownEvent(e), e.which and e.detail both evaluate to 0 for every key, but e.location gives the correct key code.

The solution provided for this lab has an error:
the final condition before the 'hurray!' alert is triggered if the index === code.length -1, but,
since index is incremented before that check, it will trigger the reward message when the 2nd to last keystroke is made instead of waiting for the last.

Suggested fix:
change:
if (index === code.length - 1)
to:
if (index === code.length)

The alert in the solution triggers prematurely. After the index is incremented after the last keystroke of "b" (which is 66) it goes right into the if statement within the first if statement and an alert pops up in the window.

Code was correct, verified by testing with posted solution branch, error window pops up in init file but not in the event handler. Using Chrome.

You have the wrong solution in the konami-code-lab-js-intro-000 repository.
In the "solution" branch in the 12th line should be "if (index === code.length) {"

Thanks for your work.
With best regards, Alexander Bunta.

https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/initKeyboardEvent

Keyboard event in the test code should probably be initialized using the KeyboardEvent constructor instead. Similar issues reported in #21 and #20 - codes should probably correspond to the KeyboardEvent.code property instead of the ASCII keycodes in KeyboardEvent.which, which property has been deprecated. Not sure how detail ever worked for this, since it seems to be
a property of the UIEvent.prototype that is always 0 for keyboard events. https://developer.mozilla.org/en-US/docs/Web/API/UIEvent/detail

This still seems to work when we run learn in the terminal, likely because node has not dropped support for initKeyboardEvent as quickly as Chrome.

This lab needs to be reworked to not use an alert, or code needs to be added to the index-test.js file. Google has disabled alert within an iframe unless the allow modal property has been enabled, per the MDN

https://developer.mozilla.org/en-US/docs/Web/API/Window/alert, under Notes -- "Starting with Chrome 46.0 this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-modal."

Please describe what you want the init() function to do. I had no idea that you actually wanted 2 functions written, 1 to bind the event handler and 1 to define what it does. I had put all my code in the area where you commented "// your code here", which was underneath init().

The code below is my code for this lab and it works as it should when I run it on my personal web server using WAMP. However, it doesn't past the Learn test. The thing is when I run the Learn sample solution on my WAMP server the "alert" box appears when you press the second last letter - "B". Shouldn't the alert box be showing up on the last letter "A" instead?

// This is my code works with WAMP but not for the Learn test.
const code = [38, 38, 40, 40, 37, 39, 37, 39, 66, 65]

    init();

    function init() {

        var index = 0;
        const getElement = document.querySelector('body');

        getElement.addEventListener('keydown', function(e) {
            if (code[index] === e.which || code[index] === e.detail) {
                index++;

                if (index === code.length) {
                    alert("CHEAT EXECUTED!!");
                    index = 0;
                }
            } else {
                index = 0;
            }
        })
    }

The alert would not fire, so this 'expect(spy.called).to.equal(true);' never evaluates to true. Even from the javascript console, an alert won't fire. I know the README hints at this, but it also implies that the test will pass. I shared this with my coaches as well.

I passed the test for the konami code, but I noticed that the test can be passed with

`if (index === code.length - 1) {

•    alert("YOU DID IT!")
  

•    index = 0`
  

the code.length - 1 didn't make any sense to me, but it allows you to pass the test. Shouldn't it only allow you to pass the test when you've executed ever part of the code? If you run the above, you get the alert YOU DID IT after pressing "B" and not finishing with A.

You'll see how people have passed the test:

Example: https://github.com/braden337/konami-code-lab-js-intro-000/commit/42aa2de784f43453cc5c420310850c1885e2d080

You can look at my github and see that I removed the -1 from the if statement.

In the 'contrived, short example' for this lab, there is a problem with this section of the code:

function onKeyDownHandler(e) {
const key = parseInt(e.detail || e.which)
if (key === alphabet[index])

Since key is an integer, it will NEVER ===alphabet[index]

Also (2nd issue?), for some reason, key is assigned to the unicode value for the uppercase letter (65 for 'a') even though the lowercase letter is typed (should be 97). So, even changing the line of code to be if key ===alphabet[index].charCodeAt() doesn't evaluate as true even when it should.

All tests pass but the alert piece is not functioning when called. The DOM also returns an error around browser sync and the IDE does the same when loading with the following. Additionally there does not appear to be anything in the indexTest.js file to report the results of the test back after looking through with a technical coach:

In the IDE:

[1/4] Resolving packages...
warning learn-browser > sinon > [email protected]: This package is unmaintained. Use @sinonjs/formatio instead
warning learn-browser > browser-sync > browser-sync-ui > weinre > [email protected]: express 2.x series is deprecated
warning learn-browser > browser-sync > browser-sync-ui > weinre > express > [email protected]: connect 1.x series is deprecated
warning learn-browser > browser-sync > browser-sync-ui > weinre > express > connect > [email protected]: Old versions of Formidable are not compatible with thecurrent Node.js; Upgrade to 1.2.0 or later

DOM error on load on the test page:

Uncaught ReferenceError: browserSync is not defined
at l (learnBrowser.min.js:1)
at Runner.mocha.run.on.on (learnBrowser.min.js:1)
at Runner.EventEmitter.emit (mocha.js:389)
at mocha.js:5317
at mocha.js:5165
at next (mocha.js:4800)
at mocha.js:4844
at timeslice (mocha.js:82)

I've typed up code that logically should work. The problem with JavaScript is its suboptimal syntax, which means that event when the code looks right, there might be something off. And the error message in the terminal is unhelpful--it doesn't provide syntax hints.

P.S. I set up the function in a more efficient/concise way than the template on the page.

(I've committed what I wrote to GitHub, for your reference.)

Hello. There appears to be something wrong with the httpserver for this lab. Despite my code passing the tests, the browser will not display my alert if the Konami Code is entered correctly. In fact, even if an alert is written into the console itself, it will not display. I should note that when I create alerts in other tabs on my browser, the alert() function works just fine.

No rush, but it would be nice to see the alert for typing in the Konami Code correctly. From what I hear, I am not the only student who has been having this issue, either.

Thanks for looking into this!

Steven

Was able to pass the test with this wrong code:
even on the last index we still i++, the code.length - 1 does not account for the fact that at the last index [9] we still need to see what the user types in. Because it does not it alerts early without the last code being typed

if (index === code.length - 1) {
alert("YOU DID IT!")
index = 0;