Thursday, March 12, 2020

Authentication and Authorization with Azure Ad using Implicit Flow and Security Groups

Authentication

The process of identifying is a process of identifying the identity of a person or process or device. This process identifies the end user and get the basic details about the user. This process only see if the user is who it is but has nothing to do with giving it access to the resources.

Authorization

Authorization is something that decide what part of the system or resources an end user can access based on their identity.

So, I want to know how these things are actually implemented in the real world.

Fow now, I am aware of Microsoft Identity Platform, Auth0 and Identity server.

I have started looking into MS Identity platform and how to implement these different Authentication flows in real world.

I am talking about real world implementations, so it is better to point you to the some code that I have started to write to get these implementations done.

As the title of the article says, I have use the Implicit flow to authenticate the user. AzureAdSamples is my GitHub repo that will eventually evolve to have most of these Authentication flows.

There not much to explain here if you follow the document in the github and try to run the app with the changes suggested in the Git document, you should be able to run this app and see the content.

Let me know if you face any issues.

Happy coding..

Sunday, September 8, 2019

Create React App Functional Automation Testing with Cypress

This post I am going to discuss about the new testing framework for testing, it is called Cypress and integrating the Cypress tests in CI pipeline.

I encourage you to go through how-to-works section of the website and get a brief idea of how it is different from existing framework like Selenium.

Setup 


Start with setting up your Create React App and Cypress following the blog code-create-react-app-v3-and-its-cypress-tests-using-typescript.

This will get you up and running with cypress and you app with Create React app and Typescript. I was using Azure DevOps for CI so I had to create a variable SKIP_PREFLIGHT_CHECK in my pipeline to make it work.



Writing Tests


If you have every written tests with mocha then you will find yourself in very familiar environment. Cypress has adopted mocha style syntax. Read about the bundled tools.

I am gonna give example of very simple tests. As, purpose of this article is to make you aware of things we can do in Cypress. 

describe('Should render', () => {

  it('Successfully loads', () => {
    cy.visit('/');
  });

  it('State Select', function () {
    cy.visit("/")
   
    cy.get('#select-name').should('be.visible')
  })
})

These 2 tests are testing if application loads successfully and my states select is rendered. 

I have configured my base url in the cypress.json file so that I do not have to type it again and again.

{
"baseUrl": "http://localhost:3000"
}

Running Tests


You can run Cypress tests using command npx cypress open from command line if you are using npm and have npx available. 

I have added scripts to start cypress when I am running locally or when I need to run t from CI. 

"scripts": {
"cypress:open": "cypress open",
"cypress:run": "cypress run",
"cypress:verify": "cypress verify",
"ci:cypress-run": "start-server-and-test start http://localhost:3000 cypress:run"
},

These are the tasks I have added in package.json to run cypress.

use cypress:open while doing locall development which open the Electron browser and watch the changes. So I can see my tests run while I am typing them. It is super fast.. I Love it.

cypress:run is used to run the tests from command line. 

cypress:verify is task added to verify that cypress is installed properly. 

CI/CD


You might have other tasks in the pipeline which will do you package restores versioning and builds. So once your code is built you want to run your tests. 

Here is how my pipeline looks like 

Build Pipeline
Build Pipeline

Once my build is successful I would want to verify cypress is installed properly.

Cypress Verify
Cypress Verify
Now that we know that cypress is installed properly and my actual step which will run the tests will fail only if there are tests failure and not because issue with cypress.

Note: In command line tasks you might have to change your working folder in the Advanced settings.

Now comes the part where we need to run the cypress tests. 

I am using a package start-server-and-test and it helps me start the server monitor the url and then run my tests in one script task.

Cypress run
If you see my script tasks

"scripts": {
   "cypress:run""cypress run",
   "cypress:verify""cypress verify",
   "ci:cypress-run""start-server-and-test start http://localhost:3000 cypress:run"
  },

ci:cypress-run task is the one that is responsible for running my tests. This task is running my create react script start task and monitoring the url and later run my tests. 

If you will run the command locally you will see that the recordings are saved in the Cypress/Videos folder. 

If your tests are run successfully you will see those great lines at the end of CI.





Thursday, June 13, 2019

Test Xamarin Forms app for Android 10 and iOS 13

Google and Apple have both released their new OS for mobile. Google with Android Q and Apple with iOS 13.  Have a quick look at the new features of iOS 13 and of Android Q.

I work on Xamarin Forms and I was eager to test my app on the new releases. So these steps are specific to Xamarin development with Visual Studio on Windows and Visual Studio for Mac.

Let's start with iOS.

iOS 13 Setup

To use the iOS 13 simulator, you would need to install xCode 11 beta. You can download this from the apple developer website. 

Once you install the XCode 11 beta you can configure the new simulators for iOS 13. 

If you open with Visual Studio it will not show you the iOS 13 simulators for your iOS project. To make them available, we would need to change the SDK to point to xCode-beta. To change the SDK location Goto Visual Studio - Preferences - Projects - SDK Locations - Apple and change the Xcode location to xCode 11 beta as shown in the image below. 


Apple SDK location

You will need to restart Visual Studio.

Monday, January 7, 2019

4th day with Xamarin

The 3rd day of Xamarin was spent configuring MVVM, Dependency Injection and a Dialog Service in the application. Also, I had a working application for both Android and iOS.

Now, that I have a working app I would like to set up CI/CD for my Android and iOS apps.

I am going to use AppCenter to build and distribute my app. Check out video "Continuous Integration With App Center Build for Xamarin Apps" on Microsoft Developers channel.

You can create a free account on AppCenter but, it will have some restrictions. However, If you are going to use it as an Individual then it should be enough for you.


If you follow the video you should be able to create a project for both Android and iOS project.

Wednesday, January 2, 2019

3rd day with Xamarin

The second day with Xamarin was spent setting up the permissions and Azure build Pipeline to build the Android and iOS projects.

Today I am planning to do
  • MVVM in the app 
  • Setting up Dependency Injection 
  • Dialog Service

MVVM


MVVM is Model-View-ViewModel and you can read about it on Microsoft website Here. It is an application pattern that allows us to build de-coupled components. I would suggest reading through the article to get a better understanding of  MVVM components before reading ahead.