Develop Reference

Vue.js net::ERR_INCOMPLETE_CHUNKED_ENCODING Webpack error

While using Vue.js 2.3.4 in development on Chrome 58.0.3029 I keep getting this error in developer tools console:
Failed to load resource: net::ERR_INCOMPLETE_CHUNKED_ENCODING
:8080/__webpack_hmr
Everything appears to be working OK, but after updating everything I still see this error and wondered if it's something I need to pay attention to.
Also, I want to clear out any unnecessary errors.

var hotMiddleware = require('webpack-hot-middleware')(compiler, {
log: () => {},
heartbeat: 2000
})
Worked for me, and also this:
var hotMiddleware = require('webpack-hot-middleware')(compiler, {
log: false,
heartbeat: 2000
})
and you must run again npm run dev command.
Thanks to #Jack Barham
Note: im using the PWA Template.

There's a pull request to fix this in the webpack template repo, but it hasn't been merged as of this writing.
I've implemented the fix from the PR in several projects and it seems to work fine.
In build/dev-server.js, add heartbeat: 2000 to the options object passed to require('webpack-dev-middleware') so it ends up looking like:
var hotMiddleware = require('webpack-hot-middleware')(compiler, {
log: () => {},
heartbeat: 2000
})
Edit: it seems as though a newer identical PR was just accepted/merged.

I am finding trouble using log4js-protractor-appender

My log4js.js file code
'use strict';
var log4js = require('log4js');
var log4jsGen = {
getLogger: function getLogger() {
log4js.loadAppender('file');
log4js.addAppender(log4js.appenders.file('./ApplicationLogs.log'), 'logs');
var logger = log4js.getLogger('logs');
return logger;
}
};
module.exports = log4jsGen;
My conf.js file(specific to appender section only)
"appenders": [{
"type": "log4js-protractor-appender",
"append": 'false',
"maxLogSize": 20480,
"backups": 3,
"category": "relative-logger"
}],
Problem:
1) IS there a way that the logs will get overwritten in each run.
2) Why log4js-protractor-appender is not working, instead log4js is working, the merit of the previous is that it resolves the promises which is passed as an argument.

Thats a great question. Yes log4js-protractor-appender is awesome. It is built specially for Protractor based environments and it places all logger command in Protractor Control flow and resolves Protractor promises before logging.
You were using it incorrectly. The appender options are not part of Protractor config options but can be integrated. The approach you have is a little old one and I have updated by blog post
These are the steps as an answer to your question-2
Step 1: Install log4js npm module
Step 2: Install log4js-protractor-appender module
Step 3: Add the logger object creation logic in protractor beforeLaunch() and assign it onto ​​browser protractor global object
'use strict';
var log4js = require('log4js');
beforeLaunch:function(){
if (fs.existsSync('./logs/ExecutionLog.log')) {
fs.unlink('./logs/ExecutionLog.log')
}
log4js.configure({
appenders: [
{ type: 'log4js-protractor-appender', category: 'protractorLog4js' },
{
type: "file",
filename: './logs/ExecutionLog.log',
category: 'protractorLog4js'
}
]
});
},
onPrepare: function() {
browser.logger = log4js.getLogger('protractorLog4js');
},
Step 4: Use logger object in your tests by accessing through browser.logger
describe('sample test', function(){
it('Sample Check', function(){
browser.get("http://www.protractortest.org/#/");
browser.logger.info("Testing Log4js");
browser.sleep(5000);
browser.logger.info('Displayed text is:', browser.getCurrentUrl());
var elm = element(by.css('.lead'))
browser.logger.info('Displayed text is:', elm.getText());
});
});
But one thing to note is - This appender is just an console appender and will not be able to write to file. The file will still contain unresolved promises
Sample Output:
[21:54:23] I/local - Starting selenium standalone server...
[21:54:23] I/launcher - Running 1 instances of WebDriver
[21:54:25] I/local - Selenium standalone server started at http://192.168.1.5:60454/wd/hub
Started
[2017-02-03 21:54:30.905] [INFO] protractorLog4js - Testing Log4js
[2017-02-03 21:54:35.991] [INFO] protractorLog4js - Displayed text is: http://www.protractortest.org/#/
[2017-02-03 21:54:36.143] [INFO] protractorLog4js - Displayed text is: Protractor is an end-to-end test framework for Angular and AngularJS applications. Protractor runs tests against your application running in a real browser, interacting with it as a user would.
.
Answer to your Question 1: How to overwrite logs each run. I added a simple logic in beforeLaunch() to delete old logs if they exist and its part of the code snippet I pasted above

I have check this issue with and followed the steps mentioned in Answer 1 and it works for me.
Earlier I was getting log output in Console only but now I am getting log in console and file also.
I corrected the file path passing and Set type: "file" in log4js configure in conf file.
Log4js in Conf file
Log appender in file
Please let me know if you face any issue again.
Thanks

multiCapabilities and jasmine focused tests

The Story:
We have a rather huge end-to-end protractor test codebase. We have two configs - one is "local" - to run the tests in Chrome and Firefox using directConnect, and the other one is "remote" - to run tests on a remote selenium server - BrowserStack in our case.
Our "local" config is configured to run some tests in Chrome and some in Firefox - because we really cannot run some tests in Chrome - for instance, keyboard shortcuts don't work in Chrome+Mac. Running the tests that require using keyboard shortcuts in Firefox is a workaround until the linked chromedriver issue is resolved.
Here is the relevant part of the configuration:
var firefox_only_specs = [
"../specs/some_spec1.js",
"../specs/some_spec2.js",
"../specs/some_spec3.js"
];
exports.config = {
directConnect: true,
multiCapabilities: [
{
browserName: "chrome",
chromeOptions: {
args: ["incognito", "disable-extensions", "start-maximized"]
},
specs: [
"../specs/**/*.spec.js",
"../specs/**/**/*.spec.js",
"../specs/**/**/**/*.spec.js"
],
exclude: firefox_only_specs
},
{
browserName: "firefox",
specs: firefox_only_specs
}
],
// ...
};
The problem:
Now, the problem is that, if I'm debugging a single test, or want to run a single test - I'm marking it is as focused (via fdescribe/fit) - but protractor starts two driver sessions - one for Chrome and the other one for Firefox, using both configured capabilities:
Running "protractor:local" (protractor) task
[launcher] Running 2 instances of WebDriver
...
------------------------------------
[chrome #1] PID: 2329
[chrome #1] Using ChromeDriver directly...
[chrome #1] Spec started
...
------------------------------------
[firefox #2] PID: 2330
[firefox #2] Using FirefoxDriver directly...
[firefox #2] Spec started
...
The question:
Is there a way to tell protractor to use the only one capability that has a focused spec configured?
Using currently latest protractor 3.0.0.
Hope the question is clear. Let me know if you need any additional information.

I wonder if you can do something to wrap the it statements like:
onPrepare: function() {
browser.getCapabilities().then(function(caps) {
global.browserName = caps.caps_.browserName;
});
global.firefoxOnly = function(name, testFunction) {
if (browserName === 'firefox') {
return it(name, testFunction);
} else {
return xit(name, testFunction).pend('firefox only');
}
};
}
Then when you write a test, instead of it use something like:
describe('when I do something', function() {
firefoxOnly('it should do the right thing', function() {
doSomething();
expect(thing).toBe(right);
)};
});
I have no idea if this actually works, just throwing it out there. In fact, when I get back to my testing computer and try it out, I would be interested in adding a function like wip to use instead of xit to automatically pend my ATDD tests!

Is there a way to tell protractor to use the only one capability that has a focused spec configured?
According to the relevant github issue, it is not possible.

Running QUnit (TypeScript) tests with Chutzpah gives "Called start() outside of a test context while already started"

I've got a fairly simple repro with an outcome I don't understand.
Make sure you have the Chutpah Test Adapter 4.0.3 installed. Using Visual Studio 2013 take the following steps:
Create a new .NET 4.5.1 class library project;
Add the NuGet package qunit.TypeScript.DefinitelyTyped 0.1.7;
Add a TypeScript file file1.ts to the project with this content:
/// <reference path="./Scripts/typings/qunit/qunit.d.ts"/>
QUnit.test("QUnit is working", assert => assert.ok(true));
Right-click inside that file and pick "Run JS Tests" from the context menu.
I can confirm that file1.js is generated as expected.
The result is that no tests are run, the test explorer shows no tests, and the Test output shows:
Error: Error: Called start() outside of a test context while already started
at start in file:///C:/Users/username/AppData/Local/Microsoft/VisualStudio/12.0/Extensions/abcxyz/TestFiles/QUnit/qunit.js (line 287)
at startQUnit in phantomjs://webpage.evaluate() (line 12)
at onPageLoaded in phantomjs://webpage.evaluate() (line 16)
in phantomjs://webpage.evaluate() (line 18)
While Running:c:\users\username\documents\visual studio 2013\Projects\ClassLibrary3\ClassLibrary3\file1.ts
------ Test started: File: c:\users\username\documents\visual studio 2013\Projects\ClassLibrary3\ClassLibrary3\file1.ts ------
Error: Error: Called start() outside of a test context while already started
While Running:c:\users\username\documents\visual studio 2013\Projects\ClassLibrary3\ClassLibrary3\file1.ts
0 passed, 0 failed, 0 total (chutzpah).
========== Total Tests: 0 passed, 0 failed, 0 total ==========
If I choose the "Open In Browser" Chutzpah context menu item I get a regular QUnit test page, nicely formatted, showing zero tests run.
Obviously the expected result was that one test was successfully run.
What am I missing here?

D'oh! The Chutzpah + TypeScript documentation is actually pretty clear about this:
You need to tell Chutzpah how to compile your files into JavaScript using the compile setting in the chutzpah.json file.
For the scenario from the question take e.g. these steps to get it to work:
Add a chutzpah.json file to the root of your project.
Enter the following code:
{
"Compile": {
"Mode": "External",
"Extensions": [".ts"],
"ExtensionsWithNoOutput": [".d.ts"]
}
}
After this the right-click run will already improve, showing:
========== Total Tests: 1 passed, 0 failed, 1 total ==========
If this doesn't work right away close and re-open the solution.
To get the tests to show up in the Test Explorer you need to group them into modules, e.g. by adding this to file1.ts:
QUnit.module("Qu.Testing");
For more info, see the Compile Setting documentation.
Leaving this up here should others fall in the same trap I did.

Sublime Linter/ ReferenceError: window is not defined?

I know this is very basic question, but it's very strange that I cannot make it work, after spending hours, I really need help.
OSX 10.8.4
sublime Text 2 Version 2.0.2 Build 2221
node v0.10.15
jshint v2.1.7
Actually, I clean-installed sublime Text 2 just for this; just Sublime Package Control has been installed.
Firstly, I prepared a foo.js code:
function x(a, b)
{
return a + b
res = x(10, 20)
console.log("res = " + res);
which result:
$ jshint foo.js
foo.js: line 3, col 17, Missing semicolon.
foo.js: line 6, col 16, Missing semicolon.
foo.js: line 2, col 1, Unmatched '{'.
3 errors
So, jshint works as expected so far for the simple test.
I tried many things to get it work with Sublime Linter, but with no success, I clean-installed the sublime app, then followed a tutorial video:
https://tutsplus.com/lesson/sublime-linter/
Looks easy, and Sublime Linter appearrently successfully installed and readme appears as the video show at 00:30, but in my case, after that, saving or whatever never triggers anything.
Well, I'm totally lost. Please advise. Thanks.
UPDATE:
I noticed sublimeText console shown a error!
Traceback (most recent call last):
File "./SublimeLinter.py", line 431, in _update_view
File "./SublimeLinter.py", line 143, in run_once
File "./sublimelinter/modules/base_linter.py", line 291, in run
File "./sublimelinter/modules/javascript.py", line 72, in parse_errors
ValueError: Error from jshint: /Users/ken/Library/Application Support/Sublime Text 2/Packages/SublimeLinter/sublimelinter/modules/libs/jshint/jshint.js:7881
})(window)
^
ReferenceError: window is not defined
at Object.require.util (/Users/ken/Library/Application Support/Sublime Text 2/Packages/SublimeLinter/sublimelinter/modules/libs/jshint/jshint.js:7881:4)
EDIT:
ok, this seems bug, I should have checked there first..
https://github.com/SublimeLinter/SublimeLinter/issues

There is currently a workaround for this:
The hotfix for this is - in Linux installations - to add
global.window = {};
to the top of the file
~/.config/sublime-text-2/Packages/SublimeLinter/sublimelinter/modules/libs/jshint/jshint.js
For Windows or OS/X installations you need to find the location of your Sublime Text package configurations.

For those that are still getting this error, edit the JSHint configuration file and add the following option:
"jshint_options": {
"undef": true,
"unused": true,
"browser": true, /* Defines DOM globals such as window, navigator, FileReader, etc. */
"jquery": true, /* OPTIONAL: globals exposed by jQuery */
"devel": true, /* OPTIONAL: globals such as debugging, alert */
"globals": { /* OPTIONAL: set others that aren't predefined by JSHint */
"Modernizr": true
}
}
Learn more about the pre-defined JSHint global variables