itnext.io/javascript-convert-html-css-to-pdf-print-supported-very-sharp-and-not-blurry-c5ffe441eb5e
How to Update npm Packages to their Latest Version – HostingAdvice.com
Javascript debugging helper – Count number of eventlisteners in Chrome console
Paste and run one of the code blocks below in chrome console to get eventlisteners count.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
//eventlisteners counter - grouped summary Array.from(document.querySelectorAll('*')) .reduce(function(pre, dom){ var evtObj = getEventListeners(dom) Object.keys(evtObj).forEach(function (evt) { if (typeof pre[evt] === 'undefined') { pre[evt] = 0 } pre[evt] += evtObj[evt].length }) return pre }, {}) //_------------------------------------------- // //eventlisteners - totalcount var totalCount = 0; Array.from(document.querySelectorAll('*')).reduce(function(pre, dom){ var evtObj = getEventListeners(dom) Object.keys(evtObj).forEach(function (evt) { if (typeof pre[evt] === 'undefined') { pre[evt] = 0 } // pre[evt] += evtObj[evt].length totalCount += evtObj[evt].length; }) return totalCount; }, {}) //--------------------------------------- |
jasmine parameterized unit test – Stack Overflow
Based on piotrek’s answer and the article Parameterized testing in Javascript, you could also use the following approach which uses ES6 syntax:
I have tested it with the Jest test framework, but it should work with Jasmine as well.
How to use underscore lib from DefinitelyTyped with typescript? – Stack Overflow
Step 1. install type definitions (e.g. vs code intellisense) to project:
npm install –save @types/underscore
(https://www.npmjs.com/package/@types/underscore)
Step 2. import to ts file:
import * as _ from “underscore”;
Source: How to use underscore lib from DefinitelyTyped with typescript? – Stack Overflow
TypeScript vs. C#: LINQ
TypeScript counterparts for C# LINQ.
Source: TypeScript vs. C#: LINQ
How to include and use jQuery in Angular CLI project
Tested in angular version 7:
- install jquery:
npm install jquery
install jquery typescript intellisense:
npm install @types/jquery - edit the angular.json file in root folder:
in the architect / build / scripts location, add this:123"scripts": [ "./node_modules/jquery/dist/jquery.min.js" ] - To use jquery inside a component.ts add this import at the top:
import $ from ‘jquery’;
Example code to check for functionality:
component html:123<button (click)="testJQuery()">Test jquery</button>component.ts:123456testJQuery() {$('html').fadeOut();$('html').fadeIn();}Click on the button should fade out and fade in the entire page.
Source: How to include and use jQuery in Angular CLI project
json2typescript – npm
NPM Package for converting from JSON to TypeScript object.
json2typescript In Angular 2 applications, everyone consumes JSON API’s from an external source. Type checking and object mapping is only possible in TypeScript, but not in the JavaScript runtime. As the API may change at any point, it is important for larger projects to verify the consumed data. json2typescript is a small package containing a helper class that maps JSON objects to an instance of a TypeScript class. After compiling to JavaScript, the result will still be an instance of this class. One big advantage of this approach is, that you can also use methods of this class.
Source: json2typescript – npm
cors-proxy-server – npm
I wanted to try out some Angular code against a demo odata service, but when requesting data from another domain in a web browser (the angular context) you might get:
Access to XMLHttpRequest at ‘http://services.odata.org/V4/OData/OData.svc/Products?$format=json’ from origin ‘http://localhost:4200’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: Redirect is not allowed for a preflight request.
To get around this problem you could use a node proxy like this one:
Source: cors-proxy-server – npm
Install and start it up. Now we can call the odata service by prepending the proxy url before the actual api endpoint like this:
http://localhost:9090/http://services.odata.org/V4/OData/OData.svc/Products
Notice the double http://
The entire CORS problem can be summarized like this:
The web browser will prevent javascript to get a response from the service at domain x if that server does not explicitly say its ok to respond the remote caller. In our case our source domain is ‘localhost’ and the services.odata.org haven’t added that as a valid domain to respond to according to the web browser.
More info regarding CORS here: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
npm vs Yarn – Which Package Manager Should You Use? – KeyCDN
npm and Yarn are two well-known JavaScript package managers. If you’re not familiar with what a package manager does, it essentially is a way automate the process of installing, updating, configuring, and removing pieces of software (AKA packages) retrieved from a global registry. In this post, we’ll be going over what differences exist between two of the most popular JavaScript package managers – npm and Yarn.
Source: npm vs Yarn – Which Package Manager Should You Use? – KeyCDN