Testing on mobile devices

Testing the frontend on our mobile devices is important for many reasons, its not always sufficient to just resize the web browser to aquire the same width as a mobile device. Partially because datetimepickers, dropdown menus etc uses their native element instead of our those we use on our PC web browser.

• How to connect to the application using your phone?

In order to connect the easiest way is to share network from your phone to your PC, this will make the project host on you phones network. Then you simply run "Npm start" from the folder /frontend and this message appears:

Local: http://localhost:3000/app On Your Network: http://172.20.10.8:3000/app

Go ahead and enter the "On your network" URL in your mobile device web browser, now you can test the front end on your phone.

Testing in Firefox for mobile devices

When pressing ctrl + shit + m in the Firefox web browser the inspection tool with the responsive design setting is being opened. From there you can choose which device you would like to mimic. (Note that the native dropdown menus, datetimepickers etc wont be mimicked)