{
  "doc": {
    "id": "api/utilities/blob",
    "title": "Cypress.Blob | Cypress Documentation",
    "description": "Cypress automatically includes a Blob library and exposes it as `Cypress.Blob`.",
    "section": "api",
    "source_path": "/llm/markdown/api/utilities/blob.md",
    "version": "48b03b5502f7aea1d0454750cce208f775403542",
    "updated_at": "2026-05-20T19:00:20.270Z",
    "headings": [
      {
        "id": "api/utilities/blob#cypress-blob",
        "text": "Cypress.Blob",
        "level": 1
      },
      {
        "id": "api/utilities/blob#syntax",
        "text": "Syntax",
        "level": 2
      },
      {
        "id": "api/utilities/blob#usage",
        "text": "Usage",
        "level": 3
      },
      {
        "id": "api/utilities/blob#examples",
        "text": "Examples",
        "level": 2
      },
      {
        "id": "api/utilities/blob#image-fixture",
        "text": "Image Fixture",
        "level": 3
      },
      {
        "id": "api/utilities/blob#using-an-image-fixture-for-jquery-plugin-upload",
        "text": "Using an image fixture for jQuery plugin upload",
        "level": 4
      },
      {
        "id": "api/utilities/blob#getting-dataurl-string",
        "text": "Getting dataUrl string",
        "level": 3
      },
      {
        "id": "api/utilities/blob#create-an-img-element-and-set-its-src-to-the-dataurl",
        "text": "Create an img element and set its src to the dataUrl",
        "level": 4
      },
      {
        "id": "api/utilities/blob#history",
        "text": "History",
        "level": 2
      },
      {
        "id": "api/utilities/blob#see-also",
        "text": "See also",
        "level": 2
      }
    ]
  },
  "chunks": [
    {
      "id": "api/utilities/blob#examples",
      "doc_id": "api/utilities/blob",
      "heading": "Examples",
      "heading_level": 2,
      "content_markdown": "## Examples\n\n### Image Fixture\n\n#### Using an image fixture for jQuery plugin upload\n\n```\n// programmatically upload the logocy.fixture('images/logo.png').as('logo')cy.get('input[type=file]').then(function ($input) {  // convert the logo base64 string to a blob  const blob = Cypress.Blob.base64StringToBlob(this.logo, 'image/png')  // pass the blob to the fileupload jQuery plugin  // https://github.com/blueimp/jQuery-File-Upload  // used in your application's code  // which initiates a programmatic upload  $input.fileupload('add', { files: blob })})\n```\n\n### Getting dataUrl string\n\n#### Create an `img` element and set its `src` to the `dataUrl`\n\n```\nreturn Cypress.Blob.imgSrcToDataURL('/assets/img/logo.png').then((dataUrl) => {  const img = Cypress.$('<img />', { src: dataUrl })  cy.get('.utility-blob').then(($div) => {    // append the image    $div.append(img)  })  cy.get('.utility-blob img').click().should('have.attr', 'src', dataUrl)})\n```\n",
      "section": "api",
      "anchors": [
        "examples"
      ],
      "path": "/llm/json/chunked/api/utilities/blob.json",
      "token_estimate": 145
    },
    {
      "id": "api/utilities/blob#image-fixture",
      "doc_id": "api/utilities/blob",
      "heading": "Image Fixture",
      "heading_level": 3,
      "content_markdown": "### Image Fixture\n\n#### Using an image fixture for jQuery plugin upload\n\n```\n// programmatically upload the logocy.fixture('images/logo.png').as('logo')cy.get('input[type=file]').then(function ($input) {  // convert the logo base64 string to a blob  const blob = Cypress.Blob.base64StringToBlob(this.logo, 'image/png')  // pass the blob to the fileupload jQuery plugin  // https://github.com/blueimp/jQuery-File-Upload  // used in your application's code  // which initiates a programmatic upload  $input.fileupload('add', { files: blob })})\n```\n",
      "section": "api",
      "anchors": [
        "image-fixture"
      ],
      "path": "/llm/json/chunked/api/utilities/blob.json",
      "token_estimate": 84
    },
    {
      "id": "api/utilities/blob#using-an-image-fixture-for-jquery-plugin-upload",
      "doc_id": "api/utilities/blob",
      "heading": "Using an image fixture for jQuery plugin upload",
      "heading_level": 4,
      "content_markdown": "#### Using an image fixture for jQuery plugin upload\n\n```\n// programmatically upload the logocy.fixture('images/logo.png').as('logo')cy.get('input[type=file]').then(function ($input) {  // convert the logo base64 string to a blob  const blob = Cypress.Blob.base64StringToBlob(this.logo, 'image/png')  // pass the blob to the fileupload jQuery plugin  // https://github.com/blueimp/jQuery-File-Upload  // used in your application's code  // which initiates a programmatic upload  $input.fileupload('add', { files: blob })})\n```\n",
      "section": "api",
      "anchors": [
        "using-an-image-fixture-for-jquery-plugin-upload"
      ],
      "path": "/llm/json/chunked/api/utilities/blob.json",
      "token_estimate": 80
    },
    {
      "id": "api/utilities/blob#getting-dataurl-string",
      "doc_id": "api/utilities/blob",
      "heading": "Getting dataUrl string",
      "heading_level": 3,
      "content_markdown": "### Getting dataUrl string\n\n#### Create an `img` element and set its `src` to the `dataUrl`\n\n```\nreturn Cypress.Blob.imgSrcToDataURL('/assets/img/logo.png').then((dataUrl) => {  const img = Cypress.$('<img />', { src: dataUrl })  cy.get('.utility-blob').then(($div) => {    // append the image    $div.append(img)  })  cy.get('.utility-blob img').click().should('have.attr', 'src', dataUrl)})\n```\n",
      "section": "api",
      "anchors": [
        "getting-dataurl-string"
      ],
      "path": "/llm/json/chunked/api/utilities/blob.json",
      "token_estimate": 59
    },
    {
      "id": "api/utilities/blob#create-an-img-element-and-set-its-src-to-the-dataurl",
      "doc_id": "api/utilities/blob",
      "heading": "Create an img element and set its src to the dataUrl",
      "heading_level": 4,
      "content_markdown": "#### Create an `img` element and set its `src` to the `dataUrl`\n\n```\nreturn Cypress.Blob.imgSrcToDataURL('/assets/img/logo.png').then((dataUrl) => {  const img = Cypress.$('<img />', { src: dataUrl })  cy.get('.utility-blob').then(($div) => {    // append the image    $div.append(img)  })  cy.get('.utility-blob img').click().should('have.attr', 'src', dataUrl)})\n```\n",
      "section": "api",
      "anchors": [
        "create-an-img-element-and-set-its-src-to-the-dataurl"
      ],
      "path": "/llm/json/chunked/api/utilities/blob.json",
      "token_estimate": 53
    },
    {
      "id": "api/utilities/blob#history",
      "doc_id": "api/utilities/blob",
      "heading": "History",
      "heading_level": 2,
      "content_markdown": "## History\n\n| Version | Changes |\n| --- | --- |\n| [5.0.0](/llm/markdown/app/references/changelog.md) | Return type of `arrayBufferToBlob`, `base64StringToBlob`, `binaryStringToBlob`, and `dataURLToBlob` methods changed from `Promise<Blob>` to `Blob` |\n| [5.0.0](/llm/markdown/app/references/changelog.md) | Added `arrayBufferToBinaryString`, `binaryStringToArrayBuffer` methods. |\n",
      "section": "api",
      "anchors": [
        "history"
      ],
      "path": "/llm/json/chunked/api/utilities/blob.json",
      "token_estimate": 51
    }
  ]
}