Why is my graphql query return all product?

I'm testing graphql query on Shopify GraphiQL Explorer for filtering products on Storefront API.

My query is like this:

query ProductType {
  collectionByHandle(handle: "pants") {
    handle
    products(first: 10, filters: {
      productType: "pants"
    }) {
      edges {
        node {
          handle
          productType
        }
      }
    }
  }
}

And got the result like this:

{
  "data": {
    "collectionByHandle": {
      "handle": "pants",
      "products": {
        "edges": [
          {
            "node": {
              "handle": "my-test-product-pants",
              "productType": "pants"
            }
          },
          {
            "node": {
              "handle": "pleated-straight-pants-mens-fashion-elastic-waist-casual-pants-men-streetwear-loose-ice-silk-trousers-mens-wide-leg-pants-s-2xl",
              "productType": ""
            }
          },
          ...

Basically, the result has all the products that I have for that collection. Can anybody help me with this? This is literally the code I got from shopify website

As we can see in the tutorial filters is an array

{
  "product_filters": [
    {
      "productType": "shoes"
    },
    {
      "productVendor": "bestshop"
    },
    {
      "variantOption": {
        "name": "color",
        "value": "blue"
      }
    }
  ]
}

So, try this instead

query ProductType {
  collectionByHandle(handle: "pants") {
    handle
    products(first:10, filters: [{ productType: "pants" ]}) {
            ...
    }
  }
}