I am using Webdriver.io with Mocha and Chai. I've written several tests that work great from the command line. It opens the Chrome browser, runs the tests, and displays the resultsin the command line. However I am having issues getting the results of the tests to display in the browser view (have a presentation that I would like to show the tests in the browser view). I'm using the mocha html template for viewing tests in the browser, but it only displays "passes: 0failures: 0duration: 0s" in the upper right. I've copied the html file to the first file in my testing structure and changed the paths to the js and css files. I don't see anything in here that references webdriver.io, is that the missing piece?
<!DOCTYPE html>
<html>
<head>
<title>Mocha</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./node_modules/mocha/mocha.css" />
</head>
<body>
<div id="mocha"></div>
<script src="./node_modules/mocha/mocha.js"></script>
<script src="./node_modules/chai/chai.js"></script>
<script>mocha.setup('bdd');</script>
<script src="./test/specs/createNewProduct.js"></script>
<script>
mocha.run();
</script>
</body>
</html>
I'm opening the file by right clicking on it and opening with Chrome.
Hi I am not clear understand what you want to achieve. But have look to https://github.com/webdriverio-boneyard/wdio-allure-reporter
It is generate beautiful reports for wdio
Related
I installed a fresh copy of WebStorm and opened up an existing Angular project.
When I open up any HTML file in the project the IDE shows 'Cannot find div' for all div tags in the .html file. For a few seconds the IDE is fine, then it shows a '2.5.3 Typescript' tab with a list of TypeScript errors.
Some Typescript tab errors:
Error:(1, 2) TS2304: Cannot find name 'div'.
Error:(3, 4) TS2304: Cannot find name 'div'.
Error:(3, 9) TS2304: Cannot find name 'ngIf'.
I've tried invalidating the cache and restarting. I've tried disabling TSLint. I've tried injecting language for some of the attributes/tags.
Even index.html throws a bunch of TypeScript errors.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title></title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="">
</head>
<body>
</body>
</html>
I expect no red squiggly marks in the .html file since it is all valid.
It works fine in VS Code.
Known issue, WEB-36373 is fixed in 2018.3.3.
For now, I can suggest turning Angular language service off in Settings | Languages & Frameworks | TypeScript (all the angular functionality will still be available)
This is the error code I am getting. I am a novice at this and could really use some help. I happened to open the "developer" tool in Chrome and might have made a mistake or something because now I cannot see my slider or testimonials. Can anyone help? Sorry if my question is not posed correctly, I am having a panic attack and this is my first time using this form. The slider works fine in other browsers, just not Chrome -- all of a sudden.
GET https://fitkidsstage.com/wp-content/plugins/revslider/public/assets/css/settings.css?ver=5.1.6 net::ERR_CONTENT_DECODING_FAILED
jquery-migrate.min.js?ver=1.4.1:2 JQMIGRATE: Migrate is installed, version 1.4.1
(index):1078 GET https://fitkidsstage.com/wp-content/themes/kindergarten/js/main.js?ver=4.9.5 net::ERR_CONTENT_DECODING_FAILED
(index):1080 Uncaught SyntaxError: Unexpected token .
From here:
It happens when your HTTP request's headers claim that the content is gzip encoded, but it isn't. Turn off gzip encoding setting or make sure the content is in fact encoded.
This loads fine in Chrome (Version 65.0.3325.181 (Official Build) (64-bit)) though (exception running the script due to other missing dependencies), so your problem may be elsewhere.
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script
src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha256-3edrmyuQ0w65f8gfBsqowzjJe2iM6n0nKciPUp8y+7E="
crossorigin="anonymous"></script>
<link rel="stylesheet" href=" https://fitkidsstage.com/wp-content/plugins/revslider/public/assets/css/settings.css?ver=5.1.6">
<script src="https://fitkidsstage.com/wp-content/themes/kindergarten/js/main.js?ver=4.9.5 "></script>
<body>
<div>
Hi
</div>
</body>
after creating an ELM page and running it successfully using (elm-reactor),
I have compiled it to generate the js file and open it using browser.
using the following command : elm-make pageName.elm --output target.js.
anyway the target.js page is generated successfully but when opening it using the browser it does not show the desired outcome instead it displays the source code as per the below screen shot
Run elm-make pageName.elm without --output target.js and open produced index.html
Alternatively, create your own *.html file and embed target.js via <script> tag, as you would normally do it for any other JavaScript files:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>My app</title>
<script src="target.js"></script>
<script>
// Run the application manually.
Elm.Target.fullscreen();
<script>
</head>
<body>
</body>
</html>
Assuming that the name of the entry module is Target and you want it to take over the whole page.
I have updated my code to latest Twitter Bootstrap v3, and it has dropped support for older (ie7 or less) browsers, even ie8 / ie9 are not fully supported, so I am trying to use some third party plugin / scripts so I don't have to write IE specific css unless it's critical or necessary (not worried about css3 shadows, rounded corners etc).
modernizr.js I will be using this,
respond.js (I think I will be using it as well for media queries support in older browsers)
now tell me if modernizr.js and respond.js can work together
also
I think *html5shiv.js is not required as modernizr.js covers it (tell me if it does)? and also can I load alongside respond.js if modernizr.js doesn't provide html5 enhancement?
tell me if I still need to use ie9.js? if yes with which combination?
As I want
a) Media queries support
b) Browser detection for css3 features support (which modernizr.js does well)
c) Would like my website(s) to work in IE browsers (not worried about shadows, rounded corners etc, just bug's layout, float, etc)
so help me with this situation, oh and I also use
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en-US"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en-US"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en-US"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en-US"> <!--<![endif]-->
<!--<html class="js">-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
so tell me I need to do something with these as well to achieve my desired result (specially chrome-1 should I be using it?
Thanks
*UPDATE:*
Since I asked this question, I am using this approach, I am using custom modernizr build without html5shiv, and I dropped ie7.js tried ie9.js same results (found it v. buggy instead of helping was causing issues), using respond.js and separate html5shiv and it has been working for me fine since.
Now I also use this tag,
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
dropped chrome=1
I have recently started exploring IBM Worklight which looks really promising to build hybrid mobile apps, in order to do so, created a Worklight project while choosing Dojo Toolkit as a default framework choice and got to see the missing dojo/main.js issue.
Here is the HTML code:
<!DOCTYPE HTML>
<html>
<head>
<title>TD_Mobile</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<script src="dojo/dojo.js" data-dojo-config="isDebug: false, parseOnLoad: true, async: false"></script>
<link rel="stylesheet" href="css/TD_Mobile.css">
</head>
<body id="content" style="display: none;">
<div data-dojo-type="dojox.mobile.ScrollableView" id="view0"
data-dojo-props="selected:true"></div>
TD_Mobile
<!--application UI goes here-->
<script src="js/initOptions.js"></script>
<script src="js/TD_Mobile.js"></script>
<script src="js/messages.js"></script>
</body>
</html>
When I do build and deploy and run the project from worklight console as a common resource, got to see the main.js not found issue at the following path http://localhost:8080/apps/services/preview/TD_Mobile/common/1.0/default/dojo/main.js
And to my surprise further, I was able to search the reference folder at C:\Users\marif\workspace\WorklightServerHome\TD Mobile New\widget-resources\TD_Mobile-common-e6cd3d9088c88e96df743ed1c9a1b584a90da8c9\preview\default\dojo and don't see main.js and some more JS files there.
Looks like final deployed build somehow not working properly, would appreciate for any quick pointer.
Not all files are included in the dojo build, there is a file called build-dojo.xml in your project.
Add main.js to it.
Under <patternset id="dojo.resources.loose-modules"> add the modules you want to use.
This sounds like a write permissions issue.
Can you please create a new project and see if it happens there as well?
If it does not then the issue is solved, else it might be a plugin issue.
Do you get any error message is the Worklight console in the build process?