WebUSB API not able to find compatible device

I am trying to access my USB device through web pages (over HTTPS). My USB device is up and running and has also enabled Experimental Web Platform features chrome://flags/#enable-experimental-web-platform-features. Even though I have provided the correct vendorId and productId in the code, chrome shows the message "No compatible devices found". Where am I going wrong? Below is my code

<!DOCTYPE html>
<html lang="en">
  <head> 
  </head>
  <body>
    <button id="request-device">Request Device</button>
    <script>
document.getElementById("request-device").addEventListener("click", ()=>{
            navigator.usb.requestDevice({filters: [{vendorId: 0x03F0}, {productId: 0x5A07}]})
            .then((usbDevice)=>{
                console.log("product name: "+usbDevice.productName);
            })
            .catch((e)=>{
                console.log("There is no devie...."+e);
            });
        });
    </script>
  </body>
</html>