Geeks With Blogs

News Please visit me at my new blog!!

profile for Aligned at Stack Overflow, Q&A for professional and enthusiast programmers
"free in Christ Jesus from the law of sin and death." Romans 8:2 (ESV) Check out the Falling Plates video on YouTube.
more about the Gospel
And then listen to Francis Chan speaking at LifeLight in SD.



Programming and Learning from SD JavaScript
If I Made a New Web App over the Last 12 Years
Have you thought about how you've built web applications in the past and how you want to do it now?

Please visit me at http://bit.ly/ifIMadeANewWebApp for my reflections.

Posted On Wednesday, June 14, 2017 4:33 PM

JavaScript mess to cleaner code articles
Please come visit me and read about how to move from a JavaScript mess to cleaner code. I have several steps and a few more to come. All the code is on Github

Posted On Friday, January 6, 2017 11:48 AM

Aurelia Links
I'm posting new links at my new AlignedDev blogI’ve been following AureliaJs for quite awhile now and I’ve collected a lot of links. Here they are, in no particular order, for you to enjoy. Please follow me @alignedDev and checkout my articles on Gooroo. My Aurelia Code for a presentation https://channel9.msdn.com/E... http://pca.st/Jodj - The Aurelia JavaScript Framework with Rob Eisenberg - Hanselminutes http://www.youtube.com/watc... ......

Posted On Monday, November 14, 2016 10:25 AM

Application Insights is not showing browser exceptions when window.onerror is set
We are using Application Insights from Azure to gain insight into our production database. We noticed that the browser tab was not showing Browser exceptions. This should be working by default as discussed in their Application Insights for web pages walk through shows, but ours was empty. I was certain we didn’t have perfect JavaScript code, so I dug deeper. First I made a quick file new project in Visual Studio, checked use Application Insights, added a throw new Error(‘bad dev!`), published it ......

Posted On Thursday, November 10, 2016 3:52 PM

Karma Test Results with TFS Build
TLDR; 1. Setup the Karma Trx Reporter. 2. Add Publish Results Build Step using ../TestResults/**/karma-tes... as the path. 3. If remote Vm for Jasmine tests, copy the .trx file to the Results directory. Our team has been using JasmineJs for unit testing our client side JavaScript code. We now have over 3,000 tests! In order to run these tests on multiple browsers we useKarma, the "Spectacular Test Runner for JavaScript" created by people from Google to run all our tests on multiple browsers. ......

Posted On Friday, September 16, 2016 7:54 AM

Teaching JavaScript
Please visit my re-post of this article.I had the privilege of spending time with four interns at Omnitech this summer. See our @Omnitech Twitter feed to learn a little more about them. Sometimes it's difficult to know how to have interns at a company, but we see it as an investment in them, the community and ourselves. We've had several interns in the past become valuable employees. It's fun to see how much they grow personally and technically in just a few months or years. I didn't have the opportunity ......

Posted On Wednesday, August 24, 2016 2:35 PM

$.ajax and WebApi example
I showed $.ajax at lunch yesterday and I've put up my code on github. There’s a simple javaScript class example and a Knockout example for comparison. I also avoided using jQuery (except for the $.ajax). I also added a knockout example to you can compare a simple example. Getting WebApi setup threw me for a loop. Use GlobalConfiguration.Configu... Also I needed some help to post a primitive value to a WebApi method. EDIT: August 25, 2015: I updated my AjaxExample using a data ......

Posted On Wednesday, August 19, 2015 6:12 PM

When does $.when.apply resolve the promises?
I learned some new things about $.when.apply that were worth sharing. http://jsfiddle.net/logankd... · the first reject will fire the .always, but not the .then · .then won’t fire until all promises are resolved (or one is rejected) Maybe not new to you, but I had to try it out after seeing the last answer at http://stackoverflow.com/qu... I was playing with this again and made a different, simplified playground on codepen. 11/13/15EDIT 2: ......

Posted On Friday, January 30, 2015 7:53 PM

MutationObserver in HTML5
We were just in a code review and one of the guys showed how he was using the MutationObserverer with our search control to get tiles to resize after the list (Knockout observable). I hadn’t heard of this before and it looks very useful. Read the linked html5rocks.com page (from 2012) to learn more about it. It’s supported on all but Opera mini and started in IE 11 and is a more performant than the old Mutation Events that have been deprecated. You point the MutationObserver to the DOM node and it ......

Posted On Thursday, January 29, 2015 7:55 PM

ctrl+p in Chrome Developer Tools to find and open a file
I was watching part of Using TypeScript for Large Angular JS Applications on TypeScript. In the SourceMaps and TypeScript section, Justin Schwarty mentions that ctrl+p in the Chrome Dev Tools will pull up a list of files (css, js) that you can debug against. This is similar to the ctrl + comma in Visual Studio (or ctrl + t with Resharper). Hopefully, you’re already aware of this, but for me it will be a huge time server. I’ve searched through the tree of files far too often. The official shortcuts ......

Posted On Tuesday, January 13, 2015 4:03 PM

Include your JavaScript references in the correct order
I was stuck for 2 hours on this. I was using Wijmo library and was including the complete library before the open js file. I kept getting’Uncaught TypeError: Cannot call method 'formatString' of undefined’. Finally, I switched the order and put the open js file before the complete js file and the error went away. The lesson is that undefined means you haven’t defined it yet . Make sure it isn’t defined below it and that you didn’t forget to include it ......

Posted On Monday, January 7, 2013 3:51 PM

Not using JavaScript Promises? It is time to make the change.
If you ignore the Angular part of this article, it applies to JavaScript in general. If you're still using callbacks with $.ajax(, please look into Promises. jQuery has an implementation (though I've heard it doesn't exactly follow the standard. It will be native in ES6 (the next version of JavaScript) http://www.2ality.com/2014/... – this is an in-depth on ES6 promises. http://kangax.github.io/com... - even the next IE will have it. Wrangle Async Tasks With JQuery ......

Posted On Tuesday, December 16, 2014 1:30 PM

Ajax promises without jQuery
I’m trying to move away from jQuery, since I’m using Knockout and AngularJS more all the time. I’ve always done my AJAX calls with the useful jQuery $.ajax( method. Searching for “ajax without jquery” brings up a lot of results, but they all include how to do it with jQuery. First a friend found a tutorial on ES6 promises on HTML5 rocks that included an example of “Promisifying XMLHttpRequest”. Since promises aren’t in all browsers yet (IE and Android Browser) you can polyfill with es6-promise. Or ......

Posted On Tuesday, October 7, 2014 4:20 PM

Find an element in a JavaScript array
I needed a C# Dictionary like data structure in JavaScript and then a way to find that object by a key. I had forgotten how to do this, so did some searching and talked to a colleague and came up with this JsFiddle. See the code in my jsFiddle or below: var processingProgressTimeoutIds = []; var file = { name: 'test', timeId: 1 }; var file2 = { name: 'test2', timeId: 2 }; var file3 = { name: 'test3', timeId: 3 }; processingProgressTimeoutId... name: file.name, timerId: file.id }); processingProgressTimeoutId... ......

Posted On Friday, August 22, 2014 6:27 PM

Mock the window.setTimeout in a Jasmine test to avoid waiting
Jasmine has a clock mocking feature, but I was unable to make it work in a function that I’m calling and want to test. The example only shows using clock for a setTimeout in the spec tests and I couldn’t find a good example. Here is my current and slightly limited approach. If we have a method we want to test: var test = function(){ var self = this; self.timeoutWasCalled = false; self.testWithTimeout = function(){ window.setTimeout(function(){ self.timeoutWasCalled = true; }, 6000); }; }; Here’s ......

Posted On Thursday, August 21, 2014 4:42 PM

Angular Panel Discussion with Dan Wahlin, Jeremy Likness, John Papa, and Ward Bell
10 Reasons Web Developers Should Learn AngularThere is a very informative video discussing AngularJs, TypeScript, etc that is well worth your time. It got me interested and even excited about Angular and the possibilities. I’m a big fan of KnockoutJs, but this video gave me the bug to look into Angular more. Here’s a good article comparing KnockoutJs and AngularJS. Here are some notes from their discussion: They mentioned the cool demos at babylonjs.com. TypeScript pros and cons around 20 minutes ......

Posted On Monday, February 3, 2014 2:48 PM

Mock RequireJS define dependencies with config.map
I had a module dependency, that I’m pulling down with RequireJS that I needed to use and write tests against. In this case, I don’t care about the actual implementation of the module (it’s simple enough that I’m just avoiding some AJAX calls). EDIT: make sure you look at the bottom example after the edit before using the config.map approach. I found that there is an easier way. I did not want to change the constructor of the consumer as I had a chain of changes that would have to be made and that ......

Posted On Monday, August 18, 2014 4:53 PM

Notes from a short presentation on NodeJs
I volunteered myself to give a short 30 minute presentation at a work lunch and learn on NodeJs. With my limited experience I see using Node as a great tool for build process improvement, scaffolding with yeoman, and running tests with Karma. I haven’t looked into using as a full server or development stack. I guess I’m too stuck on IIS and Visual Studio :-). Here are my notes, that aren’t very well formatted, but I wanted to share it anyways. What is it? "Node.js is a platform built on Chrome's ......

Posted On Friday, May 30, 2014 8:43 AM

Pointer Event W3C Specification
Our team was using hammer.js for touch events, mainly the tap event, but found some limitations in how we are using it. A colleague investigated more and decided we should use the Pointer Event Specification and Touch Event Specification contributed by Microsoft. It’s only in Candidate recommendation and only supported in IE10 and 11 (on 1/9/2014), but there is a polyfill for that called Hand.js. “Pointer events offer a way to unify handling mouse, touch, and pen input. This means that we can add ......

Posted On Thursday, January 9, 2014 3:38 PM

Referencing files TypeScript 0.9
I was trying to reference an existing JavaScript file from my new TypeScript file using /// <reference path="app.js"/> It wasn’t being found, until I found that you need to have the file saved as UTF-8. To do this in Visual Studio 2012 on Windows 7, click on file –> save as –> then click on the down arrow of the save button and choose save with encoding. TypeScript then found my JavaScript and started parsing. Now I have a lot of errors when I build the solution (other references aren’t ......

Posted On Friday, July 12, 2013 11:51 AM

Uncaught SyntaxError: Unexpected token u. file JavaScript Error in MVC
I was getting a JavaScript error that pointed to line number 1 of my MVC page. I have a form on the page and expected the Unobtrusive Validation to work with the Data Annotations. It took me a while to realize the validation messages weren't showing. After I while I found that I was missing the @Html.ValidationMessageFor(m => m.Name). Adding that for each field fixed it. My password reset with token example. I was missing line 12 and 17. 1: @using (Html.BeginForm("PasswordRe... "Home")) 2: { ......

Posted On Monday, May 20, 2013 1:45 PM

jQuery 1.9.1+ Ajax Post is Failing even though it has a 200 Status
I’m using my DataService and AjaxService for JavaScript and upgraded to jQuery 1.9.1. One of my post methods, which was working before, started hitting the deferred fail, instead of the deferred’s done, even though the status code was 200. This method is not returning any JSON to the caller. The 1.9 upgrade guide states “Prior to 1.9, an ajax call that expected a return data type of JSON or JSONP would consider a return value of an empty string to be a success case, but return a null to the success ......

Posted On Wednesday, May 8, 2013 9:41 AM

MVC Validation of a Password with a Regular Expression
Re-posted on January 19th, 2018 to AlignedDev.net.I have requirement (specification) that the password has to be at least 7 characters long and contain a special character (~@#$&*()-_+=) which are all the specials in the number keyboard row. I found that using the RegularExpression DataAnnotations is really slick, but there was a point that caught me for a while. The problem is that @".*([!@#$&*()-_+=]+).*$" works in the UI, but fails in the unit test. @"[!@#$&*()-_+=]+" works in the ......

Posted On Friday, April 26, 2013 11:16 AM

DataService and AjaxService for JavaScript
Here is what I’ve been using to make my JavaScript more modular and testable. I’m using JQuery’s promises and the Revealing Module Pattern. I got the idea for the DataServices from John Papa's Pluralsight course on Knockoutjs, but modified it to work with promises, instead of passing in the callback as a parameter. // DataService example: dataService.UiDataService = (function (ajaxService) { 'use strict'; var webServiceUrl = "/api/UiApi/", /** * @brief Get all the components from the service. */ ......

Posted On Friday, April 12, 2013 8:54 AM

Jasmine Specification Testing Pointers
I’ve been using Jasmine JavaScript testing library for Behavior Driven Development (see my Benefits of BDD post) testing the last few months with KnockoutJs view models and the Revealing Module Pattern. We now have 244 specs on a system that will be around and hopefully expand. I was hired to get it going, then others will maintain it and add to it after I’m gone. They have helped me think through what needs to happen (when {X} it should do this), test functionality with out having to click through ......

Posted On Friday, April 5, 2013 3:18 PM

Making jQuery UI Droppable Testable
I’m using jQuery UI’s droppable for drag and drop capabilities. I wanted to be able to test it with Jasmine, but I couldn’t find a way to mock it. I found Jasmine jQuery, but wasn’t able to figure out how to spyOn or mock $('#jQueryElement').droppab... accept: function (d) { return accept(d); }, drop: function (event, ui) { drop(event, ui); } }); So I created a wrapper for this function. I’ve found that creating wrappers is an easy way to make things testable and to remove coupling to libraries ......

Posted On Tuesday, March 26, 2013 9:47 AM

Use the bind method for Jasmine toThrow Tests
Thanks to Danyal Aytekin for his Stackoverflow answer. If you want to use the toThrow in Jasmin tests on actual functions, you can use the “Function.bind, which was introduced in JavaScript 1.8.5. This works in the latest versions of Chrome and Firefox, and you can patch other browsers by defining the function yourself.” From his answer:describe('using bind with jasmine', function() { var f = function(x) { if(x === 2) { throw new Error(); } } it('lets us avoid using an anonymous function', function() ......

Posted On Thursday, March 21, 2013 2:11 PM

JsonIgnore attribute in Json.Net to ignore properties
We’re using Entity Framework to query a complex object graph using the .Include(“”) method to eager load the results, then sending it to the client with the WebApi. We’ve overridden the JavaScript Serializer in the Application_Start of Global.asax.cs of our MVC application to avoid circular dependencies. These occurred because of the Code First classes that were generated from the EF Power Tools had references to each other. It also created really large JSON structures that we didn’t need all the ......

Posted On Tuesday, March 5, 2013 1:57 PM

Google map div id must be map_canvas
The examples from Google use <div id=”map_canvas”></div... for their element. I changed it to something more specific to my project, and the zoom controls started looking funny. I reverted and tried again with the same results. I finally came across this StackOverflow question and answer (thank you again StackOverflow!) and also added an answer to the bottom to clarify what I found. The lessons are: Make sure you use map_canvas. Make sure you don’t have a max-width on the image ......

Posted On Thursday, January 24, 2013 10:12 AM

Using Json.Net JObject with WebApi
I needed to pass some data from JavaScript to my WebAi Controller and came across Rick Strahl's passing multiple POST parameters to Web API article, his use of the JObject from Json.Net and dynamics works really well. Note usage of the jsondata[“UserId”].Value<... This is a simplified example of the code I‘m using.Note: you can also return the JObject. System.Web.Mvc.HttpPost] public HttpResponseMessage UpdateUserInfo(JObject jsonData) { // http://www.asp.net/web-api/... ......

Posted On Thursday, January 17, 2013 3:21 PM

Setting a var property in the JavaScript Revealing Module Pattern requires a setter and a getter
See John Papa's article for more information on the revealing pattern.See http://www.addyosmani.com/r... for a great reference as well. I was trying to expose a property in my JavaScript object and setting it from an outside caller. When I ran the code, the value didn’t change. This held me up for awhile yesterday. When I Googled, GoodSearched the problem today, I found a question on Stackoverflow that was similar and lead me in ......

Posted On Tuesday, January 15, 2013 8:31 AM

Copyright © Aligned | Powered by: GeeksWithBlogs.net