From a4e28a74990a6923c4fa30c18bf8517830ed3acf Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 9 Jun 2017 15:22:51 -0400 Subject: [PATCH] improve readability of debugging printouts --- test/helpers.js | 74 +++++++++++++++++++++++++++---------------- test/runtime/index.js | 25 ++++++++------- 2 files changed, 60 insertions(+), 39 deletions(-) diff --git a/test/helpers.js b/test/helpers.js index d1601aa1e6..93a2bde828 100644 --- a/test/helpers.js +++ b/test/helpers.js @@ -1,11 +1,13 @@ -import jsdom from "jsdom"; -import assert from "assert"; -import * as fs from "fs"; +import jsdom from 'jsdom'; +import assert from 'assert'; +import glob from 'glob'; +import fs from 'fs'; +import chalk from 'chalk'; -import * as consoleGroup from "console-group"; +import * as consoleGroup from 'console-group'; consoleGroup.install(); -import * as sourceMapSupport from "source-map-support"; +import * as sourceMapSupport from 'source-map-support'; sourceMapSupport.install(); // for coverage purposes, we need to test source files, @@ -14,8 +16,8 @@ export function loadSvelte(test) { if (test) global.__svelte_test = true; const resolved = process.env.COVERAGE - ? require.resolve("../src/index.js") - : require.resolve("../compiler/svelte.js"); + ? require.resolve('../src/index.js') + : require.resolve('../compiler/svelte.js'); delete require.cache[resolved]; return require(resolved); @@ -36,23 +38,23 @@ export function tryToLoadJson(file) { try { return JSON.parse(fs.readFileSync(file)); } catch (err) { - if (err.code !== "ENOENT") throw err; + if (err.code !== 'ENOENT') throw err; return null; } } export function tryToReadFile(file) { try { - return fs.readFileSync(file, "utf-8"); + return fs.readFileSync(file, 'utf-8'); } catch (err) { - if (err.code !== "ENOENT") throw err; + if (err.code !== 'ENOENT') throw err; return null; } } export function env() { return new Promise((fulfil, reject) => { - jsdom.env("
", (err, window) => { + jsdom.env('
', (err, window) => { if (err) { reject(err); } else { @@ -75,19 +77,19 @@ function cleanChildren(node) { if (child.nodeType === 3) { if ( - node.namespaceURI === "http://www.w3.org/2000/svg" && - node.tagName !== "text" && - node.tagName !== "tspan" + node.namespaceURI === 'http://www.w3.org/2000/svg' && + node.tagName !== 'text' && + node.tagName !== 'tspan' ) { node.removeChild(child); } - child.data = child.data.replace(/\s{2,}/, "\n"); + child.data = child.data.replace(/\s{2,}/, '\n'); // text if (previous && previous.nodeType === 3) { previous.data += child.data; - previous.data = previous.data.replace(/\s{2,}/, "\n"); + previous.data = previous.data.replace(/\s{2,}/, '\n'); node.removeChild(child); child = previous; @@ -101,12 +103,12 @@ function cleanChildren(node) { // collapse whitespace if (node.firstChild && node.firstChild.nodeType === 3) { - node.firstChild.data = node.firstChild.data.replace(/^\s+/, ""); + node.firstChild.data = node.firstChild.data.replace(/^\s+/, ''); if (!node.firstChild.data) node.removeChild(node.firstChild); } if (node.lastChild && node.lastChild.nodeType === 3) { - node.lastChild.data = node.lastChild.data.replace(/\s+$/, ""); + node.lastChild.data = node.lastChild.data.replace(/\s+$/, ''); if (!node.lastChild.data) node.removeChild(node.lastChild); } } @@ -115,15 +117,15 @@ export function setupHtmlEqual() { return env().then(window => { assert.htmlEqual = (actual, expected, message) => { window.document.body.innerHTML = actual - .replace(/>[\s\r\n]+<") + .replace(/>[\s\r\n]+<') .trim(); - cleanChildren(window.document.body, ""); + cleanChildren(window.document.body, ''); actual = window.document.body.innerHTML; window.document.body.innerHTML = expected - .replace(/>[\s\r\n]+<") + .replace(/>[\s\r\n]+<') .trim(); - cleanChildren(window.document.body, ""); + cleanChildren(window.document.body, ''); expected = window.document.body.innerHTML; assert.deepEqual(actual, expected, message); @@ -137,7 +139,7 @@ export function loadConfig(file) { delete require.cache[resolved]; return require(resolved).default; } catch (err) { - if (err.code === "E_NOT_FOUND") { + if (err.code === 'E_NOT_FOUND') { return {}; } @@ -147,16 +149,32 @@ export function loadConfig(file) { export function addLineNumbers(code) { return code - .split("\n") + .split('\n') .map((line, i) => { i = String(i + 1); while (i.length < 3) i = ` ${i}`; - return `${i}: ${line.replace(/^\t+/, match => - match.split("\t").join(" ") - )}`; + return ( + chalk.grey(` ${i}: `) + + line.replace(/^\t+/, match => match.split('\t').join(' ')) + ); }) - .join("\n"); + .join('\n'); +} + +export function showOutput(cwd, shared) { + glob.sync('**/*.html', { cwd }).forEach(file => { + const { code } = svelte.compile( + fs.readFileSync(`${cwd}/${file}`, 'utf-8'), + { + shared + } + ); + + console.log( + `\n>> ${chalk.cyan.bold(file)}\n${addLineNumbers(code)}\n<< ${chalk.cyan.bold(file)}` + ); + }); } const start = /\n(\t+)/; diff --git a/test/runtime/index.js b/test/runtime/index.js index eb33a506df..99c4a9ee6b 100644 --- a/test/runtime/index.js +++ b/test/runtime/index.js @@ -2,11 +2,10 @@ import assert from "assert"; import * as path from "path"; import * as fs from "fs"; import * as acorn from "acorn"; -import * as babel from "babel-core"; import { transitionManager } from "../../shared.js"; import { - addLineNumbers, + showOutput, loadConfig, loadSvelte, env, @@ -16,7 +15,6 @@ import { let svelte; -let showCompiledCode = false; let compileOptions = null; function getName(filename) { @@ -35,9 +33,7 @@ require.extensions[".html"] = function(module, filename) { ); let { code } = svelte.compile(fs.readFileSync(filename, "utf-8"), options); - if (showCompiledCode) console.log(addLineNumbers(code)); // eslint-disable-line no-console - - if (legacy) code = babel.transform(code, babelrc).code; + if (legacy) code = require('babel-core').transform(code, babelrc).code; return module._compile(code, filename); }; @@ -60,9 +56,9 @@ describe("runtime", () => { } (config.skip ? it.skip : config.solo ? it.only : it)(dir, () => { + const cwd = path.resolve(`test/runtime/samples/${dir}`); let compiled; - showCompiledCode = config.show; compileOptions = config.compileOptions || {}; compileOptions.shared = shared; compileOptions.dev = config.dev; @@ -78,6 +74,7 @@ describe("runtime", () => { config.compileError(err); return; } else { + showOutput(cwd, shared); throw err; } } @@ -91,15 +88,17 @@ describe("runtime", () => { if (startIndex === -1) throw new Error("missing create_main_fragment"); const es5 = - spaces(startIndex) + + code.slice(0, startIndex).split('\n').map(x => spaces(x.length)).join('\n') + code.slice(startIndex).replace(/export default .+/, ""); acorn.parse(es5, { ecmaVersion: 5 }); } catch (err) { - if (!config.show) console.log(addLineNumbers(code)); // eslint-disable-line no-console + if (!config.show) showOutput(cwd, shared); // eslint-disable-line no-console throw err; } } + if (config.show) showOutput(cwd, shared); + Object.keys(require.cache) .filter(x => x.endsWith(".html")) .forEach(file => { @@ -140,7 +139,7 @@ describe("runtime", () => { try { SvelteComponent = require(`./samples/${dir}/main.html`).default; } catch (err) { - if (!config.show) console.log(addLineNumbers(code)); // eslint-disable-line no-console + showOutput(cwd, shared); // eslint-disable-line no-console throw err; } @@ -203,9 +202,13 @@ describe("runtime", () => { if (config.error && !unintendedError) { config.error(assert, err); } else { - if (!config.show) console.log(addLineNumbers(code)); // eslint-disable-line no-console + console.log('???'); + showOutput(cwd, shared); // eslint-disable-line no-console throw err; } + }) + .then(() => { + if (config.show) showOutput(cwd, shared); }); }); }