test-browser-stageblock-progress.ts

const client = new BlobServiceClient(url);

async function testUploadProgress() {
  const containerClient = client.getContainerClient("jeremy-test");
  const blockBlobClient = containerClient.getBlockBlobClient(
    "test-upload-progress"
  );
  const selectedFile = document.getElementById("input").files[0];
  const status = document.getElementById("status");
  await blockBlobClient.stageBlock(btoa("1"), selectedFile, selectedFile.size, {
    onProgress: (e) => {
      console.log("bytes sent: " + e.loadedBytes);
      status.innerText = "progress: bytes sent: " + e.loadedBytes;
    },
  });
}

client.getProperties().then((properties) => {
  console.log(properties);

  const button = document.getElementById("uploadButton");
  button.addEventListener("click", () => {
    testUploadProgress().catch((e) => {
      console.log("upload error", e);
    });
  });
});