Wednesday 22 December 2021

PHP + LARAVEL + Xdebug + VSCODE + DEBUGGER + mac OS


 Hey there, 

i have recently tried running the debugger in VSCODE for my LARAVEL project.

Step 1: PHP 

  •  I have installed PHP via home brew. 

                 brew install php@7.4 

  • If you want you to unlink your existing PHP and link new the version we have installed then run this. ex: You have had 7.3 with your system and we have installed 7.4 . So, to use 7.4

                     brew unlink php@7.3

            brew link php@7.4

  • Now, if u run php -v on terminal . you will see php 7.4 version.   


Step  2: XDEBUG

    • Ensure we have xdebug installed if not then kindly install it from xdebug for mac OS
      • once installation is successful then u can see xdebug on php -v command output


Step 3: Install  PHP debug in VSCODE from here PHP DEBUG

Step 4: Enabling XDEBUG debug mode and step debugging. 

    • Go to your php ini file and add below config. You can find the ini file at below path in mac.  
      • nano /usr/local/etc/php/7.4/php.ini     
      • Paste below in ini file.                                                          [Xdebug]

        zend_extension="xdebug.so"

        xdebug.mode=debug

        xdebug.client_port=9001

        xdebug.log="/tmp/xdebug.log"

        xdebug.client_host="127.0.0.1"

        xdebug.start_with_request=yes    

Step 5: Run & Debug in VSCODE



    •        Go to VSCODE and left side select run & debug option. select PHP configuration and paste below in .vscode/launch.json 

{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Listen for XDebug",
"type": "php",
"request": "launch",
"port": 9001,
"pathMappings": {"<path to your Laravel codebase>": "${workspaceFolder}"},
"ignore": [
"**/vendor/**/*.php"
]
},
{
"name": "Launch currently open script",
"type": "php",
"request": "launch",
"program": "${file}",
"cwd": "${fileDirname}",
"port": 8000
}
]
}


Step 6: Run your laravel project  which runs on port 8000 or your desired port

          php artisan serve 

Step 7:  Things to keep in mind

  • we have kept the port no 9001 for xdebug configuration . Both in VSCODE launch.json and php.ini file. 
  • we have our laravel server running at port no: 8000
  • So xdebug listens on port 9001 and laravel on 8000. whenever u hit localhost:8000 ---> xdebug will listen and start step debugging.

Thursday 16 December 2021

Angular Testing Observables (making async tests to sync )


RxJS marble testing

 getTestScheduler().flush(); // flush the observables

fakeAsync()

The fakeAsync() function enables a linear coding style by running the test body in a special fakeAsync test zone. The test body appears to be synchronous. There is no nested syntax (like a Promise.then()) to disrupt the flow of control.

     We use tick() to advance the virtual clock of the setTimeout and other observables values and there by making it sync instead of waiting for given time out and waiting on service call to give observable. 

waitForAsync() 

It hides some asynchronous boilerplate by arranging for the tester's code to run in a special async test zone

But the test's asynchronous nature is revealed by the call to fixture.whenStable(), which breaks the linear flow of control.


In short to make the async tests to sync and advance the async queue 

Rxjs marble testing --> getTestScheduler().flush();

fakeAsync() --> tick()

waitForAsync()  -->  fixture.whenStable()


Reference:

https://angular.io/guide/testing-components-scenarios