ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-23 01:25:38 -05:00
Code Issues Packages Projects Releases Wiki Activity

Adding image support to list view (#20449)

Browse Source
This commit is contained in:
Aasim Khan
2022-08-31 09:02:40 -07:00
committed by GitHub
parent 3fc3c106bb
commit 010fe91921
11 changed files with 152 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/sql/base/browser/dom.ts
View File

@@ -13,6 +13,21 @@ export function isHidden(element: HTMLElement): boolean {
return element.style.display === 'none';
}
/**
* Checks if the CSS calc expression is valid or not.
* @param expression string to be tested.
* @returns true if the expression is a valid calc expression else false.
*/
export function validateCalcExpression(expression: string): boolean {
/**
* Regex that checks if a size string is a calc expression. Source: https://codepen.io/benfoster/pen/VPjLdQ
* If the size is a valid calc expression, we want to leave it as it is.
*/
const calcRegex = /calc\(( )?([\d\.]+(%|vh|vw|vmin|vmax|em|rem|px|cm|ex|in|mm|pc|pt|ch|q|deg|rad|grad|turn|s|ms|hz|khz))( )+[+\-\*\/]( )+(\-)?([\d\.]+(%|vh|vw|vmin|vmax|em|rem|px|cm|ex|in|mm|pc|pt|ch|q|deg|rad|grad|turn|s|ms|hz|khz))( )?\)/i;
return calcRegex.test(expression);
}
/**
* Converts a size value into its string representation. This will add px to the end unless
* it already ends with %. If the size value is undefined it will return the defaultValue as-is.
@@ -20,6 +35,11 @@ export function isHidden(element: HTMLElement): boolean {
* @param defaultValue The default value to use if the size is undefined
*/
export function convertSize(size: number | string | undefined, defaultValue?: string): string {
if (types.isString(size) && validateCalcExpression(size)) {
return size;
}
defaultValue = defaultValue || '';
if (types.isUndefinedOrNull(size)) {
return defaultValue;

32
src/sql/base/test/browser/dom.test.ts
View File

@@ -4,7 +4,7 @@
*--------------------------------------------------------------------------------------------*/
import * as assert from 'assert';
import { convertSize, convertSizeToNumber } from 'sql/base/browser/dom';
import { convertSize, convertSizeToNumber, validateCalcExpression } from 'sql/base/browser/dom';
suite('DOM Tests', () => {
@@ -55,4 +55,34 @@ suite('DOM Tests', () => {
const actual = convertSizeToNumber(undefined);
assert.strictEqual(expected, actual);
});
test('Validating different calc expressions', () => {
const calcExpressionsTestInputs = [
{ input: 'calc(10px+10px)', expected: false },
{ input: 'calc(76.8px--50%)', expected: false },
{ input: 'calc(10px +10px)', expected: false },
{ input: 'calc(10px- -50%)', expected: false },
{ input: 'calc(10vmin + 10px)', expected: true },
{ input: 'calc(10% - -50.7%)', expected: true },
{ input: 'calc(103px - -50%)', expected: true },
{ input: 'calc(10px +10px)', expected: false },
{ input: 'calc(10px --50%)', expected: false },
{ input: 'calc(10vmin + 10px )', expected: true },
{ input: 'calc( 10% - -50.7%)', expected: true },
{ input: 'calc( 103px - -50%)', expected: true },
{ input: 'calc( 10% - -50.7%)', expected: true },
{ input: 'calc( 10% --50.7% )', expected: false },
{ input: 'calc( 10.89% - -50.7% )', expected: true },
{ input: 'calc( 103px - -50%)', expected: true },
{ input: 'calc', expected: false },
{ input: 'calc(sdfs - sdf)', expected: false },
{ input: 'calc(15sdfs - 456svbdf)', expected: false },
{ input: 'calc( bpx45 - 45px)', expected: false },
{ input: 'calc( 34px - 45g)', expected: false }
];
calcExpressionsTestInputs.forEach((run) => {
assert.strictEqual(run.expected, validateCalcExpression(run.input), `error validating calc expression: ${run.input}`);
});
});
});