test: custom dataTransfer type (#20571)

#18013

tests/page/page-drag.spec.ts

@@ -390,3 +390,42 @@ async function trackEvents(target: ElementHandle) {
   });
   return eventsHandle;
 }
+
+it('should handle custom dataTransfer', async ({ page, browserName, isLinux, headless }) => {
+  it.info().annotations.push({ type: 'issue', description: 'https://github.com/microsoft/playwright/issues/18013' });
+  it.skip(browserName === 'webkit' && isLinux && headless);
+  await page.setContent(`<button draggable="true">Draggable</button>`);
+
+  const resultPromise = page.evaluate(() =>
+    new Promise(resolve => {
+      document.addEventListener('dragstart', event => {
+        event.dataTransfer!.setData('custom-type', 'Hello World');
+      }, false);
+
+      document.addEventListener('dragenter', event => {
+        event.preventDefault();
+      }, false);
+      document.addEventListener('dragover', event => {
+        event.preventDefault();
+      }, false);
+
+      document.addEventListener('drop', event => {
+        event.preventDefault();
+        resolve({
+          types: event.dataTransfer!.types,
+          data: event.dataTransfer!.getData('custom-type'),
+        });
+      }, false);
+    })
+  );
+
+  await page.hover('[draggable="true"]');
+  await page.mouse.down();
+  await page.mouse.move(100, 100);
+  await page.mouse.up();
+
+  await expect(resultPromise).resolves.toEqual({
+    types: ['custom-type'],
+    data: 'Hello World',
+  });
+});