Vertically center one or more lines of text with CSS. The old and the new way.

Aligning text on the vertical center of a div element is a task we do every once in a while when we style our web applications. Moreover, we have to support more than one lines of text. With the introduction of the display: flex property this task has become a one-line case. However, there are still plenty of browsers, even newer ones, which still do not support this property. Here you can find the browser support for display: flex.

Read the complete article

Create a linked list with TypeScript

A linked list is a data structure, in which each element contains a value and has a reference to the next element in the list. The value of the element can be practically anything, from a string or a number till a complex object and these values can either be sorted or unsorted and unique or duplicated.

Read the complete article

Hints and tips about load and web tests with Microsoft Visual Studio

When dealing with large web applications you will definitely have to apply some load to the infrastructure before going or even during being online. A load test is a predefined set of URL requests that are submitted to your application from multiple virtual users. The number of the users or the amount of time a load tests runs, can be defined from you.

By testing your application with load tests you can be sure about the maximum workload or number of requests that your infrastructure can support and handle simultaneously. Having this information you can decide if you have to buy (on premise case) or rent (cloud case) new hardware.

With this article I would like to give some tips and tricks for features of the load tests in Microsoft Visual Studio.

Read the complete article

Define the width of every column in a HTML-table and show only one line of text per table-row by using the ellipsis character

A very old HTML best practice suggests that we should not use tables to structure the HTML elements inside a webpage. This solution was used extensively a decade ago, and for this reason tables got a very bad reputation in the web community. However, using tables in your HTML code for structuring and presenting a set of data is still a valid option.

When you use a table with multiple columns, you often want to define the width for each of the columns of the table.

  • One reason for that could be that you want to show more context of an “important” column than the others.

  • Another reason could be the fact that if you do not define the column widths, the longest value in a column will also define the width of the column. As a result the other columns are getting shrinked.

Read the complete article

How to test the HTML elements and their DOM properties with the Jasmine framework

When you test your JavaScript code you often want to test the user interactions with the UI of your web application and not just its logic. Testing the UI makes even more sense if you use a JS-framework which offers a list of UI controls.

Consider the following use-cases that could be unit tested:

  • The user loads a new webpage and the cursor has to be placed automatically inside the search input field.

  • The search input, together with other input elements, is placed inside a div with a red background.

Read the complete article