LayoutTests/fast/canvas/webgpu/webgpu-dispatch.html

<script id="script" type="x-shader/x-metal">
using namespace metal;

kernel void get_kernel_size(device int *result[[buffer(0)]],
                            uint3 grid_size[[threadgroups_per_grid]],
                            uint3 group_size[[threads_per_threadgroup]],
                            uint3 gid[[thread_position_in_grid]])
{
    if (gid.x != 0 || gid.y != 0 || gid.z != 0) 
        return;

    result[0] = grid_size.x;
    result[1] = grid_size.y;
    result[2] = grid_size.z;
    result[3] = group_size.x;
    result[4] = group_size.y;
    result[5] = group_size.z;
}
</script>

<script>
if (window.testRunner) {
    window.testRunner.dumpAsText();
    window.testRunner.waitUntilDone();
}

function assert(a) {
    if (!a) {
        throw new Error('Assertion Failed.');
    }
}

function run() {
    let output = document.getElementById("output");

    if (!window.testRunner) {
        output.textContent = "This test only runs inside DRT/WKTR.";
        return;
    }

    window.internals.settings.setWebGPUEnabled(true);
    let gpu = document.createElement("canvas").getContext("webgpu");
    let commandQueue = gpu.createCommandQueue();

    let library = gpu.createLibrary(document.getElementById("script").text);
    let kernelFunction = library.functionWithName("get_kernel_size");
    let pipelineState = gpu.createComputePipelineState(kernelFunction);

    let resultBuffer = gpu.createBuffer(new Int32Array(6));
    
    let commandBuffer = commandQueue.createCommandBuffer();
    let commandEncoder = commandBuffer.createComputeCommandEncoder();

    let gridSize = {
        width: 7,
        height: 6,
        depth: 5
    };
    let groupSize = {
        width: 4,
        height: 3,
        depth: 2
    };
    
    commandEncoder.setComputePipelineState(pipelineState);
    commandEncoder.setBuffer(resultBuffer, 0, 0);
    commandEncoder.dispatch(gridSize, groupSize);
    commandEncoder.endEncoding();

    commandBuffer.completed.then(() => {
        let result = new Int32Array(resultBuffer.contents);

        try {
            assert(result[0] === gridSize.width);
            assert(result[1] === gridSize.height);
            assert(result[2] === gridSize.depth);
            assert(result[3] === groupSize.width);
            assert(result[4] === groupSize.height);
            assert(result[5] === groupSize.depth);

        } catch(err) {
            output.textContent = `FAIL: ${err.message}`;
            return;
        }

        output.textContent = 'PASS';
        window.testRunner.notifyDone();
    });

    commandBuffer.commit();
}

window.addEventListener("load", run, false);

</script>
<div id="output"></div>