From cfd270bca9446e3708c45adce7caa17c5d60ebec Mon Sep 17 00:00:00 2001 From: Bryan Liao Date: Wed, 18 Jun 2025 14:12:02 -0700 Subject: [PATCH] add gzip decompressor --- components.d.ts | 20 +++++ .../__test__/gzip-decompressor.e2e.spec.ts | 31 ++++++++ .../gzip-decompressor.service.test.ts | 17 +++++ .../gzip-decompressor.service.ts | 8 ++ .../gzip-decompressor/gzip-decompressor.vue | 73 +++++++++++++++++++ src/tools/gzip-decompressor/index.ts | 12 +++ src/tools/index.ts | 2 + 7 files changed, 163 insertions(+) create mode 100644 src/tools/gzip-decompressor/__test__/gzip-decompressor.e2e.spec.ts create mode 100644 src/tools/gzip-decompressor/__test__/gzip-decompressor.service.test.ts create mode 100644 src/tools/gzip-decompressor/gzip-decompressor.service.ts create mode 100644 src/tools/gzip-decompressor/gzip-decompressor.vue create mode 100644 src/tools/gzip-decompressor/index.ts diff --git a/components.d.ts b/components.d.ts index 3e65c3cc..c0279130 100644 --- a/components.d.ts +++ b/components.d.ts @@ -82,6 +82,7 @@ declare module '@vue/runtime-core' { FormatTransformer: typeof import('./src/components/FormatTransformer.vue')['default'] GitMemo: typeof import('./src/tools/git-memo/git-memo.vue')['default'] 'GitMemo.content': typeof import('./src/tools/git-memo/git-memo.content.md')['default'] + GzipDecompressor: typeof import('./src/tools/gzip-decompressor/gzip-decompressor.vue')['default'] HashText: typeof import('./src/tools/hash-text/hash-text.vue')['default'] HmacGenerator: typeof import('./src/tools/hmac-generator/hmac-generator.vue')['default'] 'Home.page': typeof import('./src/pages/Home.page.vue')['default'] @@ -91,6 +92,7 @@ declare module '@vue/runtime-core' { IbanValidatorAndParser: typeof import('./src/tools/iban-validator-and-parser/iban-validator-and-parser.vue')['default'] 'IconMdi:brushVariant': typeof import('~icons/mdi/brush-variant')['default'] 'IconMdi:kettleSteamOutline': typeof import('~icons/mdi/kettle-steam-outline')['default'] + IconMdiArrowRightBottom: typeof import('~icons/mdi/arrow-right-bottom')['default'] IconMdiChevronDown: typeof import('~icons/mdi/chevron-down')['default'] IconMdiChevronRight: typeof import('~icons/mdi/chevron-right')['default'] IconMdiClose: typeof import('~icons/mdi/close')['default'] @@ -98,6 +100,7 @@ declare module '@vue/runtime-core' { IconMdiEye: typeof import('~icons/mdi/eye')['default'] IconMdiEyeOff: typeof import('~icons/mdi/eye-off')['default'] IconMdiHeart: typeof import('~icons/mdi/heart')['default'] + IconMdiRefresh: typeof import('~icons/mdi/refresh')['default'] IconMdiSearch: typeof import('~icons/mdi/search')['default'] IconMdiTranslate: typeof import('~icons/mdi/translate')['default'] IconMdiTriangleDown: typeof import('~icons/mdi/triangle-down')['default'] @@ -129,19 +132,36 @@ declare module '@vue/runtime-core' { MenuLayout: typeof import('./src/components/MenuLayout.vue')['default'] MetaTagGenerator: typeof import('./src/tools/meta-tag-generator/meta-tag-generator.vue')['default'] MimeTypes: typeof import('./src/tools/mime-types/mime-types.vue')['default'] + NAlert: typeof import('naive-ui')['NAlert'] NavbarButtons: typeof import('./src/components/NavbarButtons.vue')['default'] NCheckbox: typeof import('naive-ui')['NCheckbox'] + NCode: typeof import('naive-ui')['NCode'] NCollapseTransition: typeof import('naive-ui')['NCollapseTransition'] + NColorPicker: typeof import('naive-ui')['NColorPicker'] NConfigProvider: typeof import('naive-ui')['NConfigProvider'] NDivider: typeof import('naive-ui')['NDivider'] + NDynamicInput: typeof import('naive-ui')['NDynamicInput'] NEllipsis: typeof import('naive-ui')['NEllipsis'] + NForm: typeof import('naive-ui')['NForm'] + NFormItem: typeof import('naive-ui')['NFormItem'] + NGi: typeof import('naive-ui')['NGi'] + NGrid: typeof import('naive-ui')['NGrid'] NH1: typeof import('naive-ui')['NH1'] NH3: typeof import('naive-ui')['NH3'] NIcon: typeof import('naive-ui')['NIcon'] + NImage: typeof import('naive-ui')['NImage'] + NInputGroup: typeof import('naive-ui')['NInputGroup'] + NInputGroupLabel: typeof import('naive-ui')['NInputGroupLabel'] + NInputNumber: typeof import('naive-ui')['NInputNumber'] NLayout: typeof import('naive-ui')['NLayout'] NLayoutSider: typeof import('naive-ui')['NLayoutSider'] NMenu: typeof import('naive-ui')['NMenu'] + NProgress: typeof import('naive-ui')['NProgress'] + NScrollbar: typeof import('naive-ui')['NScrollbar'] + NSlider: typeof import('naive-ui')['NSlider'] NSpace: typeof import('naive-ui')['NSpace'] + NStatistic: typeof import('naive-ui')['NStatistic'] + NSwitch: typeof import('naive-ui')['NSwitch'] NTable: typeof import('naive-ui')['NTable'] NumeronymGenerator: typeof import('./src/tools/numeronym-generator/numeronym-generator.vue')['default'] OtpCodeGeneratorAndValidator: typeof import('./src/tools/otp-code-generator-and-validator/otp-code-generator-and-validator.vue')['default'] diff --git a/src/tools/gzip-decompressor/__test__/gzip-decompressor.e2e.spec.ts b/src/tools/gzip-decompressor/__test__/gzip-decompressor.e2e.spec.ts new file mode 100644 index 00000000..37f482f7 --- /dev/null +++ b/src/tools/gzip-decompressor/__test__/gzip-decompressor.e2e.spec.ts @@ -0,0 +1,31 @@ +import { expect, test } from '@playwright/test'; + +const validGzipBase64 = 'H4sIAAAAAAAAA/NIzcnJVwjPL8pJAQBWsRdKCwAAAA=='; + +test.describe('Tool - Gzip decompressor', () => { + test.beforeEach(async ({ page }) => { + await page.goto('/gzip-decompressor'); + }); + + test('Has correct title', async ({ page }) => { + await expect(page).toHaveTitle('Gzip decompressor - IT Tools'); + }); + + test('Decompresses valid base64 string and shows output', async ({ page }) => { + const input = page.getByLabel('GZipped User Input'); + const output = page.getByLabel('Decompressed Output'); + + await input.fill(validGzipBase64); + + await expect(output).toHaveValue('Hello World'); + }); + + test('Shows error for invalid input', async ({ page }) => { + const input = page.getByLabel('GZipped User Input'); + + await input.fill('invalid-base64'); + + const alert = page.getByRole('alert'); + await expect(alert).toContainText('Decompression failed'); + }); +}); diff --git a/src/tools/gzip-decompressor/__test__/gzip-decompressor.service.test.ts b/src/tools/gzip-decompressor/__test__/gzip-decompressor.service.test.ts new file mode 100644 index 00000000..eb7ce15c --- /dev/null +++ b/src/tools/gzip-decompressor/__test__/gzip-decompressor.service.test.ts @@ -0,0 +1,17 @@ +import { describe, expect, it } from 'vitest'; +import { decompress } from '../gzip-decompressor.service'; + +const validGzipBase64 = 'H4sIAAAAAAAAA/NIzcnJVwjPL8pJAQBWsRdKCwAAAA=='; + +describe('decompress', () => { + it('correctly decompresses valid gzip base64 string', async () => { + const result = await decompress(validGzipBase64); + expect(result).toContain('Hello World'); + }); + + it('throws error on invalid base64 string', async () => { + await expect(() => + decompress('not-a-valid-gzip-base64'), + ).rejects.toThrow(); + }); +}); diff --git a/src/tools/gzip-decompressor/gzip-decompressor.service.ts b/src/tools/gzip-decompressor/gzip-decompressor.service.ts new file mode 100644 index 00000000..9ea44390 --- /dev/null +++ b/src/tools/gzip-decompressor/gzip-decompressor.service.ts @@ -0,0 +1,8 @@ +export async function decompress(url: string) { + const ds = new DecompressionStream('gzip'); + const response = await fetch(`data:application/octet-stream;base64,${url}`); + const blob_in = await response.blob(); + const stream_in = blob_in.stream().pipeThrough(ds); + const blob_out = await new Response(stream_in).blob(); + return await blob_out.text(); +} diff --git a/src/tools/gzip-decompressor/gzip-decompressor.vue b/src/tools/gzip-decompressor/gzip-decompressor.vue new file mode 100644 index 00000000..beafc33a --- /dev/null +++ b/src/tools/gzip-decompressor/gzip-decompressor.vue @@ -0,0 +1,73 @@ + + + diff --git a/src/tools/gzip-decompressor/index.ts b/src/tools/gzip-decompressor/index.ts new file mode 100644 index 00000000..76b8a0e9 --- /dev/null +++ b/src/tools/gzip-decompressor/index.ts @@ -0,0 +1,12 @@ +import { ArrowsShuffle } from '@vicons/tabler'; +import { defineTool } from '../tool'; + +export const tool = defineTool({ + name: 'Gzip decompressor', + path: '/gzip-decompressor', + description: 'Decompress GZip-encoded strings', + keywords: ['gzip', 'decompressor'], + component: () => import('./gzip-decompressor.vue'), + icon: ArrowsShuffle, + createdAt: new Date('2025-06-13'), +}); diff --git a/src/tools/index.ts b/src/tools/index.ts index 388cfaf4..3b24024e 100644 --- a/src/tools/index.ts +++ b/src/tools/index.ts @@ -1,6 +1,7 @@ import { tool as base64FileConverter } from './base64-file-converter'; import { tool as base64StringConverter } from './base64-string-converter'; import { tool as basicAuthGenerator } from './basic-auth-generator'; +import { tool as gzipDecompressor } from './gzip-decompressor'; import { tool as emailNormalizer } from './email-normalizer'; import { tool as asciiTextDrawer } from './ascii-text-drawer'; @@ -116,6 +117,7 @@ export const toolsByCategory: ToolCategory[] = [ xmlToJson, jsonToXml, markdownToHtml, + gzipDecompressor, ], }, {