Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Test from color-picker-tutorial doesn't work #62

Open
DracotMolver opened this issue Oct 28, 2017 · 6 comments
Open

Test from color-picker-tutorial doesn't work #62

DracotMolver opened this issue Oct 28, 2017 · 6 comments
Assignees
@austinkelleher
Labels
bug

Comments

@DracotMolver
Copy link

Hi. I'm following the Color picker tutorial and I've got to the test part.
I think it might be how the context render the output.

This is how I have my folders structure:

/src
   |__/components
       |__/color-picker
           |__/components
              |__/color-picker-header
                  |__/test
                      |__test.js

Then, in my test.js file, I have this:

const expect = require('chai').expect;

test('color-picker-header color', function (context) {
    const output = context.render({
        color: '#000000'
    });
    expect(output.$('div').attr('style')).to.contain('background-color:#000000');
});

So, running the test, I've got the next error:

AssertionError: object tested must be an array, a map, an object, a set, a string, or a weakset, but undefined given

To see what was happening, I used the html function from Cheerio; the result:

const html = output.$.html();
// <body>[object Object]</body>

I'm not sure, if that output is correct; I mean, if is espected. But, doing the same using output.$('div') I've got initialize(0).
@DracotMolver DracotMolver changed the title Test from color-picker-tutorila doesn't work Test from color-picker-tutorial doesn't work Oct 28, 2017
@lependu
Copy link

lependu commented Oct 29, 2017

You did not mention which version of marko-cli marko etc do you use.

I spent some time to make it work too, but basically every step is in the README :) Here is what i missed at first glance, maybe it helps:

With [email protected] [email protected] :

  1. Make sure that all lasso, lasso-*, mocha, chai, etc. dependencies are definied in the package.json devDependencies section. eg.: $ npm i --save-dev ...

  2. Make sure you have a marko-cli.js configuration file in the root directory based on the example in the README.md

  3. I think it is a goot idea to separate tests in

  • test.server.js for snapshot test (with cheerio) and other unit tests
  • test.browser.js for browser test with puppeteer to test event handlers

Maybe it worth mention that puppeteer has all kind of issues handling click() events, i could not make it work so far. If someone could point to the right direction i would really appreciate it.

@DracotMolver
Copy link
Author

Well, I updated [email protected] (global) and [email protected].
I installed mocha just in case, even if the website said that the package is built on top of mocha.

"devDependencies": {
   "chai": "^4.1.2",
   "mocha": "^4.0.1"
}

from the README file:

test.js - runs only in the browser  // I'm using this
test.server.js or test-server.js - runs only on the server // I tried this one too
test.browser.js or test-browser.js - runs only in the browser 
An optional prefix can also be provided for grouping tests:

foo.test.js or foo-test.js
foo.test.server.js or foo-test-server.js
foo.test.browser.js or foo-test-browser.js

So following the rules above, my file name was right. but!, after updated marko-cli and marko, I'm still getting this error: AssertionError: object tested must be an array, a map, an object, a set, a string, or a weakset, but undefined given

If i install marko-cli as a devDependencie, I've got a different error, the next one:

An error occurred while trying to compile template at path "C:\Users\diego\Documents\Marko Projects\color-picker\node_modules\marko-cli\src\commands\
sest\util\browser-tests-runner\page-template.marko". Error(s) in template:
\test\util\browser-tests-runner\page-template.marko". Error(s) in template:                                                                               b.
1) [node_modules\marko-cli\src\commands\test\util\browser-tests-runner\page-template.marko:1:0] Unrecognized tag: lasso-page - More details: https://githu
b) [node_modules\marko-cli\src\commands\test\util\browser-tests-runner\page-template.marko:8:8] Unrecognized tag: lasso-head - More details: https://github.
Error: An error occurred while trying to compile template at path "C:\Users\diego\Documents\Marko Projects\color-picker\node_modules\marko-cli\src\command
s\test\util\browser-tests-runner\page-template.marko". Error(s) in template:                                                                              ub
1) [node_modules\marko-cli\src\commands\test\util\browser-tests-runner\page-template.marko:1:0] Unrecognized tag: lasso-page - More details: https://githu
b.com/marko-js/marko/wiki/Error:-Unrecognized-Tag                                                                                                         ub
2) [node_modules\marko-cli\src\commands\test\util\browser-tests-runner\page-template.marko:8:8] Unrecognized tag: lasso-head - More details: https://githu
b.com/marko-js/marko/wiki/Error:-Unrecognized-Tag
3) [node_modules\marko-cli\src\commands\test\util\browser-tests-runner\page-template.marko:15:8] Unrecognized tag: lasso-body - More details: https://gith
ub.com/marko-js/marko/wiki/Error:-Unrecognized-Tag
4) [node_modules\marko-cli\src\commands\test\util\browser-tests-runner\page-template.marko:19:8] Unrecognized tag: lasso-slot - More details: https://gith
ub.com/marko-js/marko/wiki/Error:-Unrecognized-Tag

Even doing what the link from the error says, the test doesn't work. [Unrecognized Tag](https://gith
ub.com/marko-js/marko/wiki/Error:-Unrecognized-Tag)

Do I have to make the marko-cli.js?, because the README files makes me feel like it is optional.

@lependu
Copy link

lependu commented Oct 30, 2017 •
edited
Loading

Yes you have to create marko-cli.js with the content i linked. And you have to add at least lasso lasso-marko lasso-require packages to the devDependencies If you have another lasso plugin installed, you have to add that to.
At least I had to.

Yeah, the README could be explicit.

I work on node:8.8.1-slim (docker) under debian 8.9. If someone more experienced can confirm the needs of the steps above, I am happy to create a PR with updated README

Edit: I created a sample project

@lependu
Copy link

lependu commented Nov 2, 2017

I played with it a little bit more. I think the problem is that the [email protected] project has [email protected] dependency. While [email protected] package has [email protected] dependency.

I think the solution is to add the

 "lasso": "*"

line to the package.json devDependencies section. Updated the example

@austinkelleher
Copy link
Member

@lependu @DracotMolver This is a bug. I'll get a fix out sometime today. Thanks for reporting this!

@austinkelleher austinkelleher self-assigned this Nov 2, 2017
@DracotMolver
Copy link
Author

@lependu thanks for the demo!.
@lependu, thanks a lot for that 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@austinkelleher austinkelleher

Labels
bug
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@austinkelleher @lependu @DracotMolver