dced96da8e
* chore(packages): Update redux utils * feat(Panes): Invert control of panes map creation * feat(Modern): Add view * feat(Panes): Decouple panes from Challenges * fix(Challenges): Decouple challenge views from panes map * fix(Challenge/views): PanesMap => mapStateToPanesMap This clarifies what these functions are doing * fix(Challenges): Add view type * fix(Panes): Remove unneeded panes container * feat(Panes): Invert control of pane content render This decouples the Panes from the content they render, allowing for greater flexibility. * feat(Modern): Add side panel This is common between modern and classic * feat(seed): Array to string file content * fix(files): Modern files should be polyvinyls * feat(Modern): Create editors per file * fix(seed/React): Incorrect keyfile name * feat(Modern): Highligh jsx correctly This adds highlighting for jsx. Unfortunately, this disables linting for non-javascript files as jshint will only work for those * feat(rechallenge): Add jsx ext to babel transformer * feat(seed): Normalize challenge files head/tail/content * refactor(rechallenge/build): Rename function * fix(code-storage): Pull in files from localStorage * feat(Modern/React): Add Enzyme to test runner This enables testing of React challenges * feat(Modern): Add submission type * refactor(Panes): Rename panes map update action
106 lines
2.9 KiB
JavaScript
106 lines
2.9 KiB
JavaScript
import _ from 'lodash';
|
|
|
|
import * as babel from 'babel-core';
|
|
import presetEs2015 from 'babel-preset-es2015';
|
|
import presetReact from 'babel-preset-react';
|
|
import { Observable } from 'rx';
|
|
/* eslint-disable import/no-unresolved */
|
|
import loopProtect from 'loop-protect';
|
|
/* eslint-enable import/no-unresolved */
|
|
|
|
import {
|
|
transformHeadTailAndContents,
|
|
setContent,
|
|
setExt
|
|
} from '../../common/utils/polyvinyl.js';
|
|
import castToObservable from '../../common/app/utils/cast-to-observable.js';
|
|
|
|
const babelOptions = { presets: [ presetEs2015, presetReact ] };
|
|
loopProtect.hit = function hit(line) {
|
|
var err = 'Exiting potential infinite loop at line ' +
|
|
line +
|
|
'. To disable loop protection, write: \n\/\/ noprotect\nas the first ' +
|
|
'line. Beware that if you do have an infinite loop in your code, ' +
|
|
'this will crash your browser.';
|
|
throw new Error(err);
|
|
};
|
|
|
|
// const sourceReg =
|
|
// /(<!-- fcc-start-source -->)([\s\S]*?)(?=<!-- fcc-end-source -->)/g;
|
|
const console$logReg = /(?:\b)console(\.log\S+)/g;
|
|
const NBSPReg = new RegExp(String.fromCharCode(160), 'g');
|
|
|
|
const isJS = _.matchesProperty('ext', 'js');
|
|
const testHTMLJS = _.overSome(isJS, _.matchesProperty('ext', 'html'));
|
|
const testJS$JSX = _.overSome(isJS, _.matchesProperty('ext', 'jsx'));
|
|
|
|
// if shouldProxyConsole then we change instances of console log
|
|
// to `window.__console.log`
|
|
// this let's us tap into logging into the console.
|
|
// currently we only do this to the main window and not the test window
|
|
export function proxyLoggerTransformer(file) {
|
|
return transformHeadTailAndContents(
|
|
(source) => (
|
|
source.replace(console$logReg, (match, methodCall) => {
|
|
return 'window.__console' + methodCall;
|
|
})),
|
|
file
|
|
);
|
|
}
|
|
|
|
export const addLoopProtect = _.cond([
|
|
[
|
|
testHTMLJS,
|
|
function(file) {
|
|
const _contents = file.contents.toLowerCase();
|
|
if (file.ext === 'html' && !_contents.indexOf('<script>') !== -1) {
|
|
// No JavaScript in user code, so no need for loopProtect
|
|
return file;
|
|
}
|
|
return setContent(loopProtect(file.contents), file);
|
|
}
|
|
],
|
|
[ _.stubTrue, _.identity ]
|
|
]);
|
|
export const replaceNBSP = _.cond([
|
|
[
|
|
testHTMLJS,
|
|
function(file) {
|
|
return setContent(
|
|
file.contents.replace(NBSPReg, ' '),
|
|
file
|
|
);
|
|
}
|
|
],
|
|
[ _.stubTrue, _.identity ]
|
|
]);
|
|
|
|
export const babelTransformer = _.cond([
|
|
[
|
|
testJS$JSX,
|
|
function(file) {
|
|
const result = babel.transform(file.contents, babelOptions);
|
|
return _.flow(
|
|
_.partial(setContent, result.code),
|
|
_.partial(setExt, 'js')
|
|
)(file);
|
|
}
|
|
],
|
|
[ _.stubTrue, _.identity ]
|
|
]);
|
|
|
|
export const _transformers = [
|
|
addLoopProtect,
|
|
replaceNBSP,
|
|
babelTransformer
|
|
];
|
|
|
|
export function applyTransformers(file, transformers = _transformers) {
|
|
return transformers.reduce(
|
|
(obs, transformer) => {
|
|
return obs.flatMap(file => castToObservable(transformer(file)));
|
|
},
|
|
Observable.of(file)
|
|
);
|
|
}
|