├── .gitignore ├── images ├── demo.gif └── icon.png ├── .vscodeignore ├── .vscode ├── extensions.json ├── tasks.json ├── settings.json └── launch.json ├── tslint.json ├── README.md ├── src ├── test │ ├── suite │ │ ├── extension.test.ts │ │ └── index.ts │ └── runTest.ts └── extension.ts ├── tsconfig.json ├── CHANGELOG.md ├── LICENSE └── package.json /.gitignore: -------------------------------------------------------------------------------- 1 | out 2 | node_modules 3 | .vscode-test/ 4 | *.vsix 5 | -------------------------------------------------------------------------------- /images/demo.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dzhavat/css-initial-value/HEAD/images/demo.gif -------------------------------------------------------------------------------- /images/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dzhavat/css-initial-value/HEAD/images/icon.png -------------------------------------------------------------------------------- /.vscodeignore: -------------------------------------------------------------------------------- 1 | .vscode/** 2 | .vscode-test/** 3 | out/test/** 4 | src/** 5 | .gitignore 6 | vsc-extension-quickstart.md 7 | **/tsconfig.json 8 | **/tslint.json 9 | **/*.map 10 | **/*.ts 11 | images/demo.gif -------------------------------------------------------------------------------- /.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | // See http://go.microsoft.com/fwlink/?LinkId=827846 3 | // for the documentation about the extensions.json format 4 | "recommendations": [ 5 | "ms-vscode.vscode-typescript-tslint-plugin" 6 | ] 7 | } -------------------------------------------------------------------------------- /tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "rules": { 3 | "no-string-throw": true, 4 | "no-unused-expression": true, 5 | "no-duplicate-variable": true, 6 | "curly": true, 7 | "class-name": true, 8 | "semicolon": [ 9 | true, 10 | "always" 11 | ], 12 | "triple-equals": true 13 | }, 14 | "defaultSeverity": "warning" 15 | } 16 | -------------------------------------------------------------------------------- /.vscode/tasks.json: -------------------------------------------------------------------------------- 1 | // See https://go.microsoft.com/fwlink/?LinkId=733558 2 | // for the documentation about the tasks.json format 3 | { 4 | "version": "2.0.0", 5 | "tasks": [ 6 | { 7 | "type": "npm", 8 | "script": "watch", 9 | "problemMatcher": "$tsc-watch", 10 | "isBackground": true, 11 | "presentation": { 12 | "reveal": "never" 13 | }, 14 | "group": { 15 | "kind": "build", 16 | "isDefault": true 17 | } 18 | } 19 | ] 20 | } 21 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # CSS Initial Value ([link](https://marketplace.visualstudio.com/items?itemName=dzhavat.css-initial-value)) 2 | 3 | VS Code extension that shows the initial value of each CSS property. 4 | 5 | ## Features 6 | 7 | Works with the following file types: 8 | 9 | * CSS 10 | * Less 11 | * Sass 12 | * Scss 13 | 14 | ## Demo 15 | 16 | ![demo](images/demo.gif) 17 | 18 | ## Credit 19 | 20 | The data used for this extension is from [MDN](https://github.com/mdn/data). 21 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | // Place your settings in this file to overwrite default and user settings. 2 | { 3 | "files.exclude": { 4 | "out": false // set this to true to hide the "out" folder with the compiled JS files 5 | }, 6 | "search.exclude": { 7 | "out": true // set this to false to include "out" folder in search results 8 | }, 9 | // Turn off tsc task auto detection since we have the necessary tasks as npm scripts 10 | "typescript.tsc.autoDetect": "off" 11 | } -------------------------------------------------------------------------------- /src/test/suite/extension.test.ts: -------------------------------------------------------------------------------- 1 | import * as assert from 'assert'; 2 | import { before } from 'mocha'; 3 | 4 | // You can import and use all API from the 'vscode' module 5 | // as well as import your extension to test it 6 | import * as vscode from 'vscode'; 7 | // import * as myExtension from '../extension'; 8 | 9 | suite('Extension Test Suite', () => { 10 | before(() => { 11 | vscode.window.showInformationMessage('Start all tests.'); 12 | }); 13 | 14 | test('Sample test', () => { 15 | assert.equal(-1, [1, 2, 3].indexOf(5)); 16 | assert.equal(-1, [1, 2, 3].indexOf(0)); 17 | }); 18 | }); 19 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "module": "commonjs", 4 | "target": "es6", 5 | "outDir": "out", 6 | "lib": [ 7 | "es6" 8 | ], 9 | "sourceMap": true, 10 | "rootDir": "src", 11 | "strict": true, 12 | "resolveJsonModule": true, 13 | /* Additional Checks */ 14 | // "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */ 15 | // "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */ 16 | // "noUnusedParameters": true, /* Report errors on unused parameters. */ 17 | }, 18 | "exclude": [ 19 | "node_modules", 20 | ".vscode-test" 21 | ] 22 | } 23 | -------------------------------------------------------------------------------- /src/test/runTest.ts: -------------------------------------------------------------------------------- 1 | import * as path from 'path'; 2 | 3 | import { runTests } from 'vscode-test'; 4 | 5 | async function main() { 6 | try { 7 | // The folder containing the Extension Manifest package.json 8 | // Passed to `--extensionDevelopmentPath` 9 | const extensionDevelopmentPath = path.resolve(__dirname, '../../'); 10 | 11 | // The path to test runner 12 | // Passed to --extensionTestsPath 13 | const extensionTestsPath = path.resolve(__dirname, './suite/index'); 14 | 15 | // Download VS Code, unzip it and run the integration test 16 | await runTests({ extensionDevelopmentPath, extensionTestsPath }); 17 | } catch (err) { 18 | console.error('Failed to run tests'); 19 | process.exit(1); 20 | } 21 | } 22 | 23 | main(); 24 | -------------------------------------------------------------------------------- /src/test/suite/index.ts: -------------------------------------------------------------------------------- 1 | import * as path from 'path'; 2 | import * as Mocha from 'mocha'; 3 | import * as glob from 'glob'; 4 | 5 | export function run(): Promise { 6 | // Create the mocha test 7 | const mocha = new Mocha({ 8 | ui: 'tdd', 9 | color: true, 10 | }); 11 | 12 | const testsRoot = path.resolve(__dirname, '..'); 13 | 14 | return new Promise((c, e) => { 15 | glob('**/**.test.js', { cwd: testsRoot }, (err, files) => { 16 | if (err) { 17 | return e(err); 18 | } 19 | 20 | // Add files to the test suite 21 | files.forEach(f => mocha.addFile(path.resolve(testsRoot, f))); 22 | 23 | try { 24 | // Run the mocha test 25 | mocha.run(failures => { 26 | if (failures > 0) { 27 | e(new Error(`${failures} tests failed.`)); 28 | } else { 29 | c(); 30 | } 31 | }); 32 | } catch (err) { 33 | e(err); 34 | } 35 | }); 36 | }); 37 | } 38 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | ## 0.2.6 (2021-12-19) 4 | 5 | - Update with latest data from MDN 6 | - Set the minimum supported VS Code version to 1.58.0 7 | - Update dependencies 8 | 9 | ## 0.2.5 (2021-06-28) 10 | 11 | - Update dependency to fix security vulnerability 12 | 13 | ## 0.2.4 (2021-06-28) 14 | 15 | - Update with latest data from MDN 16 | - Set the minimum supported VS Code version to 1.52 17 | - Update dependencies 18 | 19 | ## 0.2.3 (2019-09-02) 20 | 21 | - Add icon for marketplace 22 | 23 | ## 0.2.2 (2019-08-20) 24 | 25 | - Add support for unsaved files 26 | 27 | ## 0.2.1 (2019-08-17) 28 | 29 | - Fix regex to detect when there’s space between property and colon (#2) 30 | 31 | ## 0.2.0 (2019-08-14) 32 | 33 | - Add support for `less` files. 34 | 35 | ## 0.1.2 (2019-08-13) 36 | 37 | - Fix display of initial values of shorthand properties 38 | 39 | ## 0.1.1 (2019-08-12) 40 | 41 | - Fix support for `scss` and `sass` files. 42 | 43 | ## 0.1.0 (2019-08-12) 44 | 45 | - Add support for `scss` and `sass` files. 46 | 47 | ## 0.0.1 (2019-08-12) 48 | 49 | - Initial release 50 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2019 Dzhavat Ushev 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /.vscode/launch.json: -------------------------------------------------------------------------------- 1 | // A launch configuration that compiles the extension and then opens it inside a new window 2 | // Use IntelliSense to learn about possible attributes. 3 | // Hover to view descriptions of existing attributes. 4 | // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 5 | { 6 | "version": "0.2.0", 7 | "configurations": [ 8 | { 9 | "name": "Run Extension", 10 | "type": "extensionHost", 11 | "request": "launch", 12 | "runtimeExecutable": "${execPath}", 13 | "args": [ 14 | "--extensionDevelopmentPath=${workspaceFolder}" 15 | ], 16 | "outFiles": [ 17 | "${workspaceFolder}/out/**/*.js" 18 | ], 19 | "preLaunchTask": "npm: watch" 20 | }, 21 | { 22 | "name": "Extension Tests", 23 | "type": "extensionHost", 24 | "request": "launch", 25 | "runtimeExecutable": "${execPath}", 26 | "args": [ 27 | "--extensionDevelopmentPath=${workspaceFolder}", 28 | "--extensionTestsPath=${workspaceFolder}/out/test/suite/index" 29 | ], 30 | "outFiles": [ 31 | "${workspaceFolder}/out/test/**/*.js" 32 | ], 33 | "preLaunchTask": "npm: watch" 34 | } 35 | ] 36 | } 37 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "css-initial-value", 3 | "displayName": "CSS Initial Value", 4 | "description": "Get the initial value of each CSS property.", 5 | "version": "0.2.6", 6 | "engines": { 7 | "vscode": "^1.58.0" 8 | }, 9 | "categories": [ 10 | "Other", 11 | "Programming Languages" 12 | ], 13 | "activationEvents": [ 14 | "onLanguage:css", 15 | "onLanguage:less", 16 | "onLanguage:sass", 17 | "onLanguage:scss" 18 | ], 19 | "vsce": { 20 | "githubBranch": "main" 21 | }, 22 | "icon": "images/icon.png", 23 | "license": "MIT", 24 | "main": "./out/extension.js", 25 | "contributes": {}, 26 | "publisher": "dzhavat", 27 | "repository": { 28 | "type": "git", 29 | "url": "https://github.com/dzhavat/css-initial-value" 30 | }, 31 | "scripts": { 32 | "vscode:prepublish": "npm run compile", 33 | "compile": "tsc -p ./", 34 | "watch": "tsc -watch -p ./", 35 | "pretest": "npm run compile", 36 | "test": "node ./out/test/runTest.js" 37 | }, 38 | "devDependencies": { 39 | "@types/glob": "^7.2.0", 40 | "@types/mocha": "^9.0.0", 41 | "@types/node": "14.14.31", 42 | "@types/vscode": "1.58.0", 43 | "glob": "^7.2.0", 44 | "mocha": "^9.1.3", 45 | "tslint": "^6.1.3", 46 | "typescript": "^4.5.4", 47 | "vscode-test": "^1.6.1" 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /src/extension.ts: -------------------------------------------------------------------------------- 1 | import * as vscode from 'vscode'; 2 | import * as data from './properties.json'; 3 | 4 | interface Property { 5 | syntax: string; 6 | media: string | string[]; 7 | inherited: boolean; 8 | animationType: string | string[]; 9 | percentages: string | string[]; 10 | groups: string[]; 11 | initial: string | string[]; 12 | appliesto: string; 13 | computed: string | string[]; 14 | order: string; 15 | status: string; 16 | mdn_url?: string; 17 | } 18 | 19 | const properties: { [key: string]: Property } = data; 20 | 21 | export function activate(context: vscode.ExtensionContext) { 22 | const hoverProvider: vscode.HoverProvider = { 23 | provideHover(doc, pos, token): vscode.ProviderResult { 24 | const range = doc.getWordRangeAtPosition(pos, /[a-z\-]+\s*:/ig); 25 | 26 | if (range === undefined) { 27 | return; 28 | } 29 | 30 | const initialValue = getInitialValue(doc.getText(range)); 31 | 32 | if (initialValue === undefined) { 33 | return; 34 | } 35 | 36 | return new vscode.Hover(getText(initialValue)); 37 | } 38 | }; 39 | 40 | let disposable = vscode.languages.registerHoverProvider( 41 | ['css', 'less', 'sass', 'scss'], 42 | hoverProvider 43 | ); 44 | 45 | context.subscriptions.push(disposable); 46 | } 47 | 48 | function getInitialValue(word: string): string | string[] { 49 | return properties[word.slice(0, -1).trim()].initial; 50 | } 51 | 52 | function getText(initialValue: string | string[]): vscode.MarkdownString { 53 | let value = ''; 54 | 55 | if (Array.isArray(initialValue)) { 56 | const props = initialValue.map(item => { 57 | return `* ${item}: \`${properties[item].initial}\``; 58 | }); 59 | 60 | value = ` 61 | Initial value 62 | 63 | As each of the properties: 64 | 65 | ${props.join('\n')} 66 | `; 67 | } else { 68 | value = `Initial value: \`${initialValue}\``; 69 | } 70 | 71 | return new vscode.MarkdownString(value); 72 | } 73 | 74 | export function deactivate() {} 75 | --------------------------------------------------------------------------------