Configuring multiple SSH keys for Git projects in Bitbucket.

#Scenario
Let's say you have a corporate account associated to your private organization projects (repositories), but also have your personal account to work in two different workstations.

When you try to use a repository which do not use your "default" ssh key, you will get a message like:

even if you already added a second key for it.

What happens is that, since we are working with the same service/domain (bitbucket), only one key will be used for project referring that hostname.

So, in order to work with different projects from different accounts, we could setup an "alias" in a configuration file into our ssh folder:

# ~/.ssh/config

Host bitbucket.org
  Hostname bitbucket.org
  PreferredAuthentications publickey
  IdentityFile ~/.ssh/<keyname>

Host <domain-alias>
  Hostname bitbucket.org
  PreferredAuthentications publickey
  IdentityFile ~/.ssh/<keyname>

and use it into your git configuration:

# <repo-path>/.git/config

[remote "origin"]
    url = git@<domain-alias>:<username>/<projectname>.git
    fetch = +refs/heads/*:refs/remotes/origin/*

In this way you should be able to work projects of different accounts hosted in the same service.

Written in collaboration with John Benavides.

Evaluating element locators in Chrome Developer Tools.

When working on test automation, one of the main tasks is finding the right element locators.
So in order to validate you are working with the correct elements you could take advantage of some Dev Tools features.


Finding locators by using the Inspector:

1. Open the Chrome Dev Tools by pressing F12.
2. At the top-left side you will find the selector icon.
3. Click on it and then the element selector you want to get.

Evaluating locators in the Elements panel:

1. By pressing Ctrl+f you will invoke the Find bar.
2. So you can use it to test either your locator is present in the DOM or if it is unique.

Evaluating locators via the Console:

If you prefer to do it via the Console panel, you can use the following syntax:

$x(locator)

e.g. Finding element by its class name: $x("//input[@class='single-data']")

How to select the Chrome's developer tools Dark theme.

1. Open the Chrome developer tools (press F12 key)
2. Click on "Customize and Control DevTools" menu
3. Select "Settings" option

4. From Preferences -> Appearance section, select Theme = Dark

5. Enjoy debugging

Accessing MySQL Server from Docker Container.

For this example we will be using an image from Docker Hub.

You can list the available images by executing:

docker search mysql

and download it with:

docker pull mysql

If you want to list your local images, just type:

docker images

Now in order to create the container we can execute a command with the following options:

docker run -p <port>:<port> --name <container-name> -v <local-folder>:/var/lib/mysql -e MYSQL_ROOT_PASSWORD=<root-password> -d mysql:<tag>

where:

-p	Publish a container’s port(s) to the host
--name	Assign a name to the container
-v	Bind mount a volume
-e	Sets the MYSQL_ROOT_PASSWORD environment variable
-d	Run container in background and print container ID
tag	Tag specifying the MySQL version you want.

Then if you want to see the containers currently running:

docker ps

But, How can I start working with the MySQL of the docker container?

Via terminal (accessing the container bash):

docker exec -it <container-name> bash

Or just pointing your favorite Database Client to the container configuration:

How to show current Git Branch in the Terminal.

Adding (replacing) the following code to your .bashrc file will do the trick:

# Add git branch if its present to PS1

parse_git_branch() {
 git branch 2> /dev/null | sed -e '/^[^*]/d' -e 's/* \(.*\)/(\1)/'
}
if [ "$color_prompt" = yes ]; then
 PS1='${debian_chroot:+($debian_chroot)}\[\033[01;32m\]\u@\h\[\033[00m\]:\[\033[01;34m\]\w\[\033[01;31m\]$(parse_git_branch)\[\033[00m\]\$ '
else
 PS1='${debian_chroot:+($debian_chroot)}\u@\h:\w$(parse_git_branch)\$ '
fi

How it looks your bash prompt:

See the original post here.

Change the Browser User-Agent by using Chrome DevTools

Either you are testing an app which verifies the User-Agent or you just want to see your app rendered in a different one. There is an option included in the Chrome Developer Tools which allows you to change this value without having to install any additional third-party software for this.

Steps:

1. In Chrome, open the DevTools (by pressing F12 key)
2. Display the "Customize and control DevTools" options menu:

3. Select the "Show console drawer" option
4. From the new Console section, display the options menu:

5. Select "Network conditions" option
6. Observe the new tab is added to the Console section
7. Look for "User agent" and uncheck the "Select automatically" option
8. Now you are able to select a different agent from the list:

9. Refresh the page so the changes take effect.

How to integrate ESLint with Sublime Text 3

In order to evaluate your code using eslint, you first need to have it installed in your system.

npm install -g eslint

To test it, you can simple execute eslit <filename>.js from the command line.

1. Now, we can proceed to install the Sublime Text pluging by going through Preferences -> Package Control -> Install Package

2. Select "SublimeLinter-contrib-eslint".

3. And, finally just copy a .eslintrc file (with the rules definitions) to the root path of your project.

or generate it by typing eslint --init

And that's it!, now you will be highlighted for every syntax error detected in your files (based on your .eslintrc configuration) while editing them.