Giter VIP home page Giter VIP logo

nightwatch-docs's Introduction

Nightwatch.js Documentation

Documentation sources for nightwatchjs.org website.

npm Node.js CI codecov npm package Discord Twitter Follow

Nightwatch.js Logo


Overview

The website is built with PostDoc (a static site generator built with Vite and EJS). It supports Markdown, EJS, and front matter. It comes with a dev server with Hot module replacement (HMR).

The content is written in Markdown and it is located in the docs folder. The individual API command pages are generated from the Nightwatch source code. based on the JSDoc comments.

Run the website locally

First, simply clone the repository and install the dependencies.

git clone https://github.com/nightwatchjs/nightwatch-docs.git
npm install

Configuration

Since the API documentation is generated directly from source code, you need to have the Nightwatch source code cloned locally.

Step 1: Clone the Nightwatch repository

git clone https://github.com/nightwatchjs/nightwatch.git
npm install

Step 2: Configure the path to the Nightwatch repository

Next, you have specify the path to where the api commands are in the postdoc.config.js file. You can also set the API_DOCS_FOLDER environment variable.

// postdoc.config.js
export default {
  apidocs: {
    source: '/path/to/nightwatch/lib/api/'
}

You can also disable the API docs generation by setting the apidocs property to false in the postdoc.config.js file:

// postdoc.config.js
export default {
  apidocs: false
}

Run the website dev server

npm start

The website will be available at http://127.0.0.1:5173/.

PostDoc CLI

To view the available options, run:

npx postdoc --help

Automatically open the website in the browser

npm start -- --open [chrome|firefox|edge|safari]

Build

To build the website, run:

npm run build

The generated files will be in the out folder.

Quickly serve the generated files with:

npx postdoc preview

License

MIT

nightwatch-docs's People

Contributors

anthonyjruffa avatar automatedtester avatar beatfactor avatar betweenbrain avatar etheryte avatar garg3133 avatar gravityvi avatar harshit-bs avatar jarajesh avatar jecfish avatar jochen-testingbot avatar martin0258 avatar micahlc avatar mukeshblackhat avatar nickstefan avatar nothuman2718 avatar olivierlacan avatar parmarkrishna avatar prudhvi22 avatar pujagani avatar qwertynik avatar s9tpepper avatar sandeepthukral avatar senocular avatar sergeifilippov avatar sparshkesari avatar swrdfish avatar travco avatar vaibhavsingh97 avatar vishalshah133 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

nightwatch-docs's Issues

--test could be read as supporting folder paths

"Runs only the specified test. By default it will attempt to run all tests in the folder and its subfolders."

Could be just me, but reading "the folder" makes me think the folder specified in the argument. Combine this with --testcase, and you have the non "default" behavior of running just a single test case vs. all tests. But default here means when the argument is not specified.

"The callback function" wrongly suggests all callbacks use a response object

http://nightwatchjs.org/api#commands

Each method below allows an optional callback argument to be passed as the last argument. The callback function will then be called after the command is completed with the main instance as the context and the response object as argument.

But some commands, like isLogAvailable and getLogTypes (+more) do not reply with the response object, instead using the requested value.

Changing the commands to use the response object is probably too breaking, so the callback description should probably be updated to account for exceptions.

Upload File Not Working

Hello to all,

I try code Nightwatch upload file but it is not working. The file explorer dialog keeps open and does not select any file. I"m tested using Google Chrome chromeDriver. Below is my code:

var batchFile = "C:\\Users\\Peter Wong\\Documents\\Volare Template";
.setValue('//*[@id="upload"]', require('path').resolve(batchFile + 'batch.xls')) .click('//*[@id="btnimportprofile"]')`

Please tell me what wrong with it. I"m need this urgently as I need to present to my boss soon. Thanks.

Mocha From Nightwatch assert.containsText fails

Pretty new at this. Running the Using Mocha From Nightwatch example http://nightwatchjs.org/guide#using-mocha, verbatim test -- it's failing. Can't figure out why.

The browser launches and "nightwatch" is entered into google search....

$ npm test

> [email protected] test /var/www/html/3jbserver
> node ./node_modules/nightwatch/bin/nightwatch -c ./test/nightwatch.json ./test/google.test.js

  1) Google demo test for Mocha with Nightwatch uses BDD to run the Google simple test

  0 passing (8s)
  1 failing

  1) Google demo test for Mocha with Nightwatch uses BDD to run the Google simple test:
     Testing if element <#main> contains text: "Night Watch". - Expected "Night Watch" but got: ""
      at Context.<anonymous> (test/google.test.js:30:17)
      at Context.<anonymous> (test/google.test.js:20:7)

npm ERR! Test failed.  See above for more details.

In nightwatch.json...

  ...
  "test_runner" : {
    "type" : "mocha",
    "options" : {
      "ui" : "bdd",
      "reporter" : "list"
    }
  }
  ...

google.test.js is exactly the given example

package.json

  "scripts": {
    "test": "node ./node_modules/nightwatch/bin/nightwatch -c ./test/nightwatch.json ./test/google.test.js"
   ...

running with (npm) selenium-standalone.

Mistake in the example (environments)

I'm getting familiar with Nightwatch.

Reading this guide:
http://nightwatchjs.org/gettingstarted/

It has example of this config:

{
  ...
  "test_settings" : {
    "default" : {
      "launch_url" : "http://localhost",
      "globals" : {
        "myGlobalVar" : "some value",
        "otherGlobal" : "some other value"
      }
    },

    "integration" : {
      "launch_url" : "http://staging.host",
      "globals" : {
        "myGlobalVar" : "other value"
      }
    }
  }
}

Then it said:

If we still pass the --env integration option to the runner, then our globals object will look like below:
    console.log(browser.globals);
    // {
    //   "myGlobalVar" : "some value",
    //   "otherGlobal" : "some other value"
    // }

Given explanation, that Global env is getting overwritten with chosen one, I would expect it should be output if run with "--env integration":

   console.log(browser.globals);
    // {
    //   "myGlobalVar" : "other value",
    //   "otherGlobal" : "some other value"
    // }

Right?

fix broken links

The links back to selemium github are no longer valid in the API documentation at API > Selenium Protocol
http://nightwatchjs.org/api#protocol

For instance, the link for "/session/:sessionId/accept_alert" in the content below links back to an archived github page, not to any specific content.

acceptAlert
See /session/:sessionId/accept_alert

Accepts the currently displayed alert dialog. Usually, this is equivalent to clicking on the 'OK' button in the dialog.

the link above gives the following result:
image

Nested test groups?

Assuming I have a structure of:

specs
    -> landing
        -> login
            -> first.js
            -> second.js

I know you can specify test groups through nightwatch --group landing. Can you specify / include specific sub-groups too? Something like nightwatch --group landing.login, to only run the tests in login, rather than ALL the tests in landing.

Update documentation

Its hard to navigate/search through the documentation when new features have been added or solution added but not enough information added in documentation.

Our No. 1 priority is to get enough documentation support, so that we don't end up searching blogs and google for answers most of the time.

getValue and getText do not return string

In the docs it says the method getValue or getText returns a string.

This is not correct.

If anything, it seems to return an object (the browser object?). Also, the value is only resolved within the callback. Perhaps it is also a good idea to refer/add something about the execution of commands like described here ?

Docs: saucelabs + tunnel identifier

I found documentation for connecting to saucelabs, but I don't see any documentation for where to put the tunnel identifier. I've seen a couple other repos put it in "desiredCapabilities", like so...

"test_settings": {
  "default": {
  ...
    "desiredCapabilities": {
      "tunnel-identifier": uuid,
      "browserName": "chrome"
      ...
    }
  }
}

If that is the right place, please document.

Developer Guide "Using Nightwatch" left nav link ("#using") broken

Currently seeing on Chrome 53 (Chrome OS) when clicking on the Using Nightwatch link in the nav, the page does not scroll to the Using Nightwatch section.

http://nightwatchjs.org/guide#usage

I think this is because there are 4 elements in that page with the id "usage"

> $('[id="usage"]')
<- [<h4 id="usage">​Usage​</h4>,
 <h2 id="usage">​Using Nightwatch​</h2>, 
 <h4 id="usage">​Usage​</h4>, 
 <h4 id="usage">​Usage​</h4>]

Unable to locate list elements

I have some list elements:

**


{this.props.event ?
<button id={"productBook"} className="fito-btn fito-btn-long" style={this.props.styles.btnBrandRevers} onClick={this.props.onOfferSelect.bind(null, product)}>

:
<a className="fito-btn fito-no-radius fito-btn-to-booking" style={this.props.styles.btnBrandRevers} onClick={this.props.onOfferSelect.bind(null, product)}>


}

**

When asserting the element with id "productBook" as:
.assert.visible('button[id=productBook]')
getting an error: Testing if element <button[id=productBook]> is visible. Element could not be located. - expected "true" but got: "null"

I don't understand why this doesn't work for this specific element while it works for other elements. Is there some different way that list elements need to be verified?
Please help.

Example working with iframe with nightwatch

Hello, could you give a complete example about of working with iframe with nightwatch js?

i tried verify the iframe component but have an error when run the comand $ nightwatch

thank you

Usability Issue: Clicking Between Documentation Pages Doesn't Reposition Browser At Top Of Next Page

Description of Issue
When a user navigates between sections of the documentation by clicking one of the links in the header, the user's browser is not positioned at the top of the page for the link that the user clicked. This is a bit annoying from a usability standpoint--particularly if the user has finished reading the previous page, since the user will be required to scroll all the way to the top of the next page before they can continue reading. The video below shows the behavior that I am describing:

https://www.screencast.com/t/MbxlXlCmH

Obviously, this is a relatively minor UI issue and there's a pretty easy workaround (i.e., simply scroll up to the top of the page), but I got a bit annoyed by it as I am in the process of learning Nightwatch and am relying heavily on the documentation at the moment.

I have verified that this behavior is occurring on Chrome, Firefox, and Safari on a Mac. I do not have a Windows machine, so I cannot verify whether this behavior is occurring there, as well.

Steps to Reproduce

  1. Navigate to http://nightwatchjs.org/
  2. Click on the "Getting Started" link in the navigation bar.
  3. Scroll to the bottom of the page.
  4. Click on the "Developer Guide" link in the navigation bar.
  5. Observe that the browser is at the bottom of the new page, even though the user would likely expect to be at the top of the new page of documentation.

nested sections

could you please add a little example about nested sections to the documentation?

request: page object that uses iframe

Can you supply an example of testing an iframe withing a page object?

I am having trouble figuring out why my selectors return true if I don't use a page object, but return false if I encapsulate them in a page object.

For example, this test passes.

module.exports = {
    '@tags': ['cv'],
    'Usage Dashboard Frame Test' : function (browser) {
        browser
            .url("https://a domain .com")
            .waitForElementVisible("iframe#Main", 3000)
            // give time to the iframe to be available
            .pause(5000)
            .frame('Main')
                .waitForElementPresent('#ext-gen92', 3000)
            .end();
    }
}

This test fails: with the following error "✖ Timed out while waiting for element @manageReport to be present for 5000 milliseconds. - expected "found" but got: not found"

module.exports = {
    '@tags': ['cv','automation'],
    'Load Usage Dashboard' : function (client) {
        var usageDashboard = client.page.cvusagedashboard();
        usageDashboard.navigate();

        usageDashboard
            .waitForElementVisible('@filterFrame', 5000)
            .usageDashboard.openManage();
        client.end();
    }
};

/pages/cvusagedashboard.js

var cvCommands = {
    openManage: function(){
        this.api.pause(2000);
        return this.api.frame('@filterFrame')
             .waitForElementPresent('@manageReport', 5000)
            .click('@manageReport');
    }
};


module.exports = {
    url: 'https://www.citivelocity.com/cv2/go/CVUsageDashboard',
    commands:[cvCommands],
    elements: {
        filterFrame:{
            selector: '#Main'
        },
        manageReport: {
            selector: '#ext-gen92'
        }
    }
};

props in pageobjects

could you please add a little example about the new props feature in pageobjects to the documentation?

useCss and useXpath not listed in API reference

useCss and useXpath are client commands mentioned in a couple of places in the guide http://nightwatchjs.org/guide but are not listed in the api reference http://nightwatchjs.org/api .

They seem to be documented correctly:

so I'm not entirely sure why they're being omitted. (useRecursion I wouldn't necessarily expect to be present.)

Mocha --retires

As per this documentation it states that --retries is not supported when using Mocha but I can see that Mocha does indeed support some form of retries. Is there any chance that this will be supported at any time or is using Mocha always going to be somewhat limited? I initially believed I could use everything Mocha had to offer but would I be wrong in this assumption?

Thanks

Inconsistent docs with browser vs client

I don't believe that there is any difference between using browse vs client for the asserts, expects, commands but it seems like it would be confusing for newer users to pickup on. Just felt like it should be consistent throughout.

Should be a simple fix and I can open a PR for this.
The only thing I would need to know is which one is preferred between browser and client

Can't interact with select boxes on safari

Hey all, I've been attempting to do this for three days straight now, but no matter what method I use to interact with a select box, nothing works on safari. The option I used for just chrome still works fine on chrome browser, but we're looking to get our safari integration tests up and running.

The option that works on chrome is:

.click('select[name="elementName"] option.OptionClass')

However this leaves the selector clicked on safari but no option selected, breaking our forms that require a selection.

I've tried clicking both in succession like

.click('select[name="elementName"]')
.click(' option.OptionClass')

using keystrokes:

.click('select[name="elementName"]')
.keys(['\uE015', '\uE006'])

And about every combination in between I can think of.

Nothing on stackoverflow, google groups, or here in issues has helped so far. Has anyone encountered this issue and has anyone figured out a solution

Note: I've tried looking at a generic selenium way of doing this as well, and using the .execute('insert javascript to change value of select element') but that doesn't trigger the onchange event and the form doesn't submit anyways.

If I manually intercept the test locally and click on the select option after the automation has opened the select box it works fine, I just need a way to navigate to and or click the option after it's open.

Thanks in advance for any help

Broken screenshots saved

When test-script had been passed some screenshots is saving successfully, but some has size 3 byte and not contained any information. It's important for us to have all screens when errors occurred.
In what may be problem in those cases when screens has not saved normally?

Document Available Page Commands

Taken from nightwatchjs/nightwatch#605

From the examples in the documentation, it's clear that 'click', 'setValue', and 'assert' are available on the page object, but 'pause' is not ( being available at this.api.pause ). The other commands available on a Page are not clear without looking through the source code and finding that everything in api/element-commands is loaded onto the page object, and everything in api/client-commands is not.

I think the docs should either

  • list all the element commands in the page documentation

or

  • specify this distinction under the page documentation ( "Element commands are loaded onto the page object, client commands are not" ) and then label each method under the "Commands API Reference" as 'element' or 'client' level.

The first seems simpler, but I could see an argument for the second as well, especially if the distinction between element and page commands might matter for other modules in the future.

Parallel workers not running all tests and/or failing

Greetings,

A co-worker has created a POC (https://github.com/dieguito151/nightwatch-parallel) that demonstrates an issue that is currently hitting us. We are unable to run our tests consistently when they are spawned in parallel, meaning when we set nightwatch.conf.js per the below:

...
test_workers: {
  enabled: true,
  workers: 'auto',
},
...

When running the tests you will notice one of the tests will be skipped and/or at least one will fail. When running al tests synchronously (enabled: false) they all complete successfully.

Is here something we should correct in that POC? Thanks in advance!

  • Nestor

API documentation difficult to read

The API documentation is difficult to go through—the sidebar menus don't expand when clicked on, and don't really need to be collapsed ever in the first place.

nightwatch

"Not Secure" Message for https://nightwatchjs.org

Description of Issue
There is currently an issue when a user navigates to https://nightwatchjs.org. Specifically, there is a "Not Secure" message appearing in Chrome, Firefox, and Safari. Screenshots for each of these browsers are below:

Chrome: https://www.screencast.com/t/F3fSqEHXggd
Firefox: https://www.screencast.com/t/j07YBnMBKo
Safari: https://www.screencast.com/t/oLgefHHj

I do not have a Windows machine so I cannot test there.

If someone from a third-party website links to the nightwatchjs.org website using https instead of http, this could turn away potential users.

Steps to Reproduce

  1. Open any major browser.
  2. Navigate to https://nightwatchjs.org.
  3. Observe the security warning message.

Nightwatch configuration - no way to have parallel browsers within the same environment

I have a nightwatch.conf.js file and a globals.js file where I have defined a few hosts to run tests against.
In order to supply the host as a parameter to nightwatch, I have setup environments by hosts:

My globals.js has the following export:

module.exports = {
    beforeEach: beforeEach ,
    afterEach: afterEach ,
    default: buildGlobal('default') ,
    host1: buildGlobal('host1') ,
    host2: buildGlobal('host2') 
}

I am now exploring running tests in parallel and from a few examples, I see that the common way to run this would be to have environments by browser and pass in --env chrome,firefox

I would like to avoid setting up m browsers x n hosts environments. I am wondering if there is a more elegant way to do this.

From the docs to run in parallel, I noticed a peculiar phrase which I am hoping might help me -

You can create a separate environment per browser (by chaining desiredCapabilities)

Is chaining multiple desiredCapabilities possible? I tried to set this as an array, but it does not take.

The only other option seems to be doing something like nightwatchjs/nightwatch#498 to pass the host as a parameter, but that would entail me changing the current environments, which I would like to keep to a minimal.

Any thoughts here? I am on nightwatch v0.9.16

Missing documentation for running in safari with nightwatch 1.x

I cannot find any examples of nightwatch configs or clear instructions on how to run nightwatch 1.x tests against safari, even though the documentation implies that it is supported. The wiki page (https://github.com/nightwatchjs/nightwatch/wiki/Running-tests-in-Safari) says if you have Safari 10 or greater then it just works if you set browserName in your desiredCapabilities, but this does not work and it is not obvious or clear how you would run nightwatch against safari. The main documentation does not have any examples that include safari. The wiki page also includes some confusing instructions about manually opening a browser extension if you have an older version of selenium but those aren't clear either.

I've tried including selenium configuration information with the downloaded selenium jar but it did not work and the documentation says you should not use the standalone jar anymore anyway.

I've tried specifying the path to the safaridriver on my mac as the webdriver path but it just fails saying I have missing command line arguments for safaridriver.

Improved custom command documentation

Custom command documentation should include the different formats, command function vs class constructor, and include the requirements for using them:

  • implications of using and not using other api commands (command functions need to call another api command to complete themselves)
  • command classes format and requirements (extending EventEmitter)
  • remove "custom commands inherit from EventEmitter if defined in the form above" note for custom commands
  • remove "return this; // allows the command to be chained." in example (return not needed/ignored)
  • simpler examples (use of execute overly complicates)

Should docs mention of how to wire up errors to standard mocha?

I'm trying to replace zombiejs with nightwatch in our specs that use standard mocha. As we're already familiar with it, it was logical to keep using it and just try to shoehorn the nightwatch for now, to check it up (and probably later transition gradually).

I've stumbled upon two problems regarding errors reporting:

  1. Client errors weren't propagated to mocha "out of the box".
    I had to add somethig like this
client.on('error', function(...args) {
  console.log('error', ...args);
  throw args;
});
  1. The syntax/toolkit errors are not propagated by default.
    I had to use something like this:
client.on('complete', function(results, errors) {
  if (results.errors > 0) {
    throw new Error(errors.join('\n'));
  };  
}); 

I'm not sure that's expected or am I doing something wrong. Still, I think that's a problem with documentation - the section about integration to standard mocha doesn't state should errors propagate by default or not.

And if that's expected behavior to not propagate errors by default (for instance, because that's convinient for default runner and other integrations) the integration section of documentation should probably contain explicit mention of it snippets like those I've posted here to avoid this kind of confusion.

What should be done about that?

how do i use Xpath in the code

  1. TypeError: t.click(...).click(...).typeText(...).click(...).useXpath is not a function
    Browser: Chrome 55.0.2883 / Windows 8.1 0.0.0
    29 |await t
    30 | .click('#Product2_Tab')
    31 | .click('input[name=new]') //Name
    32 | .typeText ('#Name',"TestProd890")
    33 | .click('#IsActive')
    > 34 | .useXpath()
    35 | .Select("//*[@id='00N4100000CXYOF']/option[2]")
    36 | .useCss()
    37 | .click('input[name=save_new]')
    38 | .typeText('#td0_2','1000')

don't understand what am i missing in this? do we have to enable x-path usage anywhere?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.