Merge branch 'master' into SwappableThemes-ReorganizeFolderStructure

client/homebrew/brewRenderer/brewRenderer.jsx

@@ -17,6 +17,7 @@ const PAGE_HEIGHT = 1056;
 const PPR_THRESHOLD = 50;
 
 const BrewRenderer = createClass({
+	displayName     : 'BrewRenderer',
 	getDefaultProps : function() {
 		return {
 			text     : '',

client/homebrew/brewRenderer/errorBar/errorBar.jsx

@@ -5,6 +5,7 @@ const _     = require('lodash');
 const cx    = require('classnames');
 
 const ErrorBar = createClass({
+	displayName     : 'ErrorBar',
 	getDefaultProps : function() {
 		return {
 			errors : []

client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx

@@ -7,6 +7,7 @@ const cx    = require('classnames');	//Unused variable
 const DISMISS_KEY = 'dismiss_notification09-9-21';
 
 const NotificationPopup = createClass({
+	displayName     : 'NotificationPopup',
 	getInitialState : function() {
 		return {
 			notifications : {}

client/homebrew/editor/editor.jsx

@@ -26,6 +26,7 @@ const splice = function(str, index, inject){
 
 
 const Editor = createClass({
+	displayName     : 'Editor',
 	getDefaultProps : function() {
 		return {
 			brew : {

client/homebrew/editor/metadataEditor/metadataEditor.jsx

@@ -11,6 +11,7 @@ const Themes = require('themes/themes.json');
 const SYSTEMS = ['5e', '4e', '3.5e', 'Pathfinder'];
 
 const MetadataEditor = createClass({
+	displayName     : 'MetadataEditor',
 	getDefaultProps : function() {
 		return {
 			metadata : {

client/homebrew/editor/snippetbar/snippetbar.jsx

@@ -16,6 +16,7 @@ const execute = function(val, brew){
 };
 
 const Snippetbar = createClass({
+	displayName     : 'SnippetBar',
 	getDefaultProps : function() {
 		return {
 			brew            : {},
@@ -125,6 +126,7 @@ module.exports = Snippetbar;
 
 
 const SnippetGroup = createClass({
+	displayName     : 'SnippetGroup',
 	getDefaultProps : function() {
 		return {
 			brew           : {},

client/homebrew/homebrew.jsx

@@ -13,6 +13,7 @@ const NewPage = require('./pages/newPage/newPage.jsx');
 const PrintPage = require('./pages/printPage/printPage.jsx');
 
 const Homebrew = createClass({
+	displayName     : 'Homebrewery',
 	getDefaultProps : function() {
 		return {
 			url         : '',

client/homebrew/navbar/account.navitem.jsx

@@ -3,7 +3,7 @@ const createClass = require('create-react-class');
 const Nav = require('naturalcrit/nav/nav.jsx');
 
 const Account = createClass({
-
+	displayName     : 'AccountNavItem',
 	getInitialState : function() {
 		return {
 			url : ''

client/homebrew/navbar/editTitle.navitem.jsx

@@ -7,6 +7,7 @@ const MAX_TITLE_LENGTH = 50;
 
 
 const EditTitle = createClass({
+	displayName     : 'EditTitleNavItem',
 	getDefaultProps : function() {
 		return {
 			title    : '',

client/homebrew/navbar/navbar.jsx

@@ -6,6 +6,7 @@ const Nav = require('naturalcrit/nav/nav.jsx');
 const PatreonNavItem = require('./patreon.navitem.jsx');
 
 const Navbar = createClass({
+	displayName     : 'Navbar',
 	getInitialState : function() {
 		return {
 			//showNonChromeWarning : false,

client/homebrew/navbar/recent.navitem.jsx

@@ -10,7 +10,7 @@ const VIEW_KEY = 'homebrewery-recently-viewed';
 
 
 const RecentItems = createClass({
-
+	DisplayName     : 'RecentItems',
 	getDefaultProps : function() {
 		return {
 			storageKey : '',

client/homebrew/navbar/reddit.navitem.jsx

@@ -8,6 +8,7 @@ const MAIN_URL = 'https://www.reddit.com/r/UnearthedArcana/submit?selftext=true'
 
 
 const RedditShare = createClass({
+	displayName     : 'RedditShareNavItem',
 	getDefaultProps : function() {
 		return {
 			brew : {

client/homebrew/pages/editPage/editPage.jsx

@@ -27,6 +27,7 @@ const googleDriveInactive = require('../../googleDriveMono.png');
 const SAVE_TIMEOUT = 3000;
 
 const EditPage = createClass({
+	displayName     : 'EditPage',
 	getDefaultProps : function() {
 		return {
 			brew : {

client/homebrew/pages/homePage/homePage.jsx

@@ -21,6 +21,7 @@ const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
 
 
 const HomePage = createClass({
+	displayName     : 'HomePage',
 	getDefaultProps : function() {
 		return {
 			brew : {

client/homebrew/pages/newPage/newPage.jsx

@@ -23,6 +23,7 @@ const METAKEY = 'homebrewery-new-meta';
 
 
 const NewPage = createClass({
+	displayName     : 'NewPage',
 	getDefaultProps : function() {
 		return {
 			brew : {

client/homebrew/pages/printPage/printPage.jsx

@@ -12,6 +12,7 @@ const STYLEKEY = 'homebrewery-new-style';
 const METAKEY = 'homebrewery-new-meta';
 
 const PrintPage = createClass({
+	displayName     : 'PrintPage',
 	getDefaultProps : function() {
 		return {
 			query : {},

client/homebrew/pages/sharePage/sharePage.jsx

@@ -14,6 +14,7 @@ const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx');
 
 
 const SharePage = createClass({
+	displayName     : 'SharePage',
 	getDefaultProps : function() {
 		return {
 			brew : {

client/homebrew/pages/userPage/brewItem/brewItem.jsx

@@ -10,6 +10,7 @@ const googleDriveIcon = require('../../../googleDrive.png');
 const dedent = require('dedent-tabs').default;
 
 const BrewItem = createClass({
+	displayName     : 'BrewItem',
 	getDefaultProps : function() {
 		return {
 			brew : {

client/homebrew/pages/userPage/userPage.jsx

@@ -24,6 +24,7 @@ const ReportIssue = require('../../navbar/issue.navitem.jsx');
 
 
 const UserPage = createClass({
+	displayName     : 'UserPage',
 	getDefaultProps : function() {
 		return {
 			username : '',

package.json

@@ -18,8 +18,8 @@
     "lint:dry": "eslint **/*.{js,jsx}",
     "circleci": "npm test && eslint **/*.{js,jsx} --max-warnings=0",
     "verify": "npm run lint && npm test",
-    "test": "pico-check",
+    "test": "jest",
-    "test:dev": "pico-check -v -w",
+    "test:dev": "jest --verbose --watch",
     "phb": "node scripts/phb.js",
     "prod": "set NODE_ENV=production && npm run build",
     "postinstall": "npm run buildall",
@@ -30,8 +30,11 @@
   "eslintIgnore": [
     "build/*"
   ],
-  "pico-check": {
+  "jest": {
-    "require": "./tests/test.init.js"
+    "modulePaths": [
+      "mode_modules",
+      "shared"
+    ]
   },
   "babel": {
     "presets": [
@@ -40,10 +43,10 @@
     ]
   },
   "dependencies": {
-    "@babel/core": "^7.16.5",
+    "@babel/core": "^7.16.7",
-    "@babel/plugin-transform-runtime": "^7.16.5",
+    "@babel/plugin-transform-runtime": "^7.16.7",
-    "@babel/preset-env": "^7.16.5",
+    "@babel/preset-env": "^7.16.7",
-    "@babel/preset-react": "^7.16.5",
+    "@babel/preset-react": "^7.16.7",
     "body-parser": "^1.19.1",
     "classnames": "^2.3.1",
     "codemirror": "^5.65.0",
@@ -59,15 +62,15 @@
     "jwt-simple": "^0.5.6",
     "less": "^3.13.1",
     "lodash": "^4.17.21",
-    "marked": "4.0.8",
+    "marked": "4.0.9",
     "marked-extended-tables": "^1.0.3",
     "markedLegacy": "npm:marked@^0.3.19",
     "moment": "^2.29.1",
-    "mongoose": "^6.1.3",
+    "mongoose": "^6.1.5",
     "nanoid": "3.1.30",
     "nconf": "^0.11.3",
     "prop-types": "15.8.0",
-    "query-string": "7.0.1",
+    "query-string": "7.1.0",
     "react": "^16.14.0",
     "react-dom": "^16.14.0",
     "react-frame-component": "4.1.3",
@@ -77,8 +80,8 @@
     "vitreum": "git+https://git@github.com/calculuschild/vitreum.git"
   },
   "devDependencies": {
-    "eslint": "^8.5.0",
+    "eslint": "^8.6.0",
     "eslint-plugin-react": "^7.28.0",
-    "pico-check": "^2.2.0"
+    "jest": "^27.4.5"
   }
 }

server.js

@@ -78,16 +78,9 @@ const config = require('nconf')
 	.file('environment', { file: `config/${process.env.NODE_ENV}.json` })
 	.file('defaults', { file: 'config/default.json' });
 
-//DB
+// DB
-const mongoose = require('mongoose');
+const DB = require('./server/db.js');
-mongoose.connect(config.get('mongodb_uri') || config.get('mongolab_uri') || 'mongodb://localhost/naturalcrit',
+DB.connect(config);
-	{ retryWrites: false });
-mongoose.connection.on('error', (err)=>{
-	console.log('Error : Could not connect to a Mongo Database.');
-	console.log('        If you are running locally, make sure mongodb.exe is running.');
-	console.log(err);
-	throw 'Can not connect to Mongo';
-});
 
 //Account Middleware
 app.use((req, res, next)=>{

server/db.js

@@ -0,0 +1,37 @@
+// The main purpose of this file is to provide an interface for database
+// connection. Even though the code is quite simple and basically a tiny
+// wrapper around mongoose package, it works as single point where
+// database setup/config is performed and the interface provided here can be
+// reused by both the main application and all tests which require database
+// connection.
+
+const Mongoose = require('mongoose');
+
+const getMongoDBURL = (config)=>{
+	return config.get('mongodb_uri') ||
+           config.get('mongolab_uri') ||
+           'mongodb://localhost/homebrewery';
+};
+
+const handleConnectionError = (error)=>{
+	if(error) {
+		console.error('Could not connect to a Mongo database: \n');
+		console.error(error);
+		console.error('\nIf you are running locally, make sure mongodb.exe is running and DB URL is configured properly');
+		process.exit(1); // non-zero exit code to indicate an error
+	}
+};
+
+const disconnect = async ()=>{
+	return await Mongoose.disconnect();
+};
+
+const connect = async (config)=>{
+	return await Mongoose.connect(getMongoDBURL(config),
+		{ retryWrites: false }, handleConnectionError);
+};
+
+module.exports = {
+	connect    : connect,
+	disconnect : disconnect
+};

server/googleActions.js

@@ -96,7 +96,7 @@ GoogleActions = {
 		const drive = google.drive({ version: 'v3', auth: oAuth2Client });
 
 		const obj = await drive.files.list({
-			pageSize : 100,
+			pageSize : 1000,
 			fields   : 'nextPageToken, files(id, name, description, createdTime, modifiedTime, properties)',
 			q        : 'mimeType != \'application/vnd.google-apps.folder\' and trashed = false'
 		})

shared/homebrewery/renderWarnings/renderWarnings.jsx

@@ -7,6 +7,7 @@ const cx    = require('classnames');
 const DISMISS_KEY = 'dismiss_render_warning';
 
 const RenderWarnings = createClass({
+	displayName     : 'RenderWarnings',
 	getInitialState : function() {
 		return {
 			warnings : {}

shared/naturalcrit/codeEditor/codeEditor.jsx

@@ -40,6 +40,7 @@ if(typeof navigator !== 'undefined'){
 }
 
 const CodeEditor = createClass({
+	displayName     : 'CodeEditor',
 	getDefaultProps : function() {
 		return {
 			language      : '',

shared/naturalcrit/nav/nav.jsx

@@ -8,7 +8,8 @@ const NaturalCritIcon = require('naturalcrit/svg/naturalcrit.svg.jsx');
 
 const Nav = {
 	base : createClass({
-		render : function(){
+		displayName : 'Nav.base',
+		render      : function(){
 			return <nav>
 				<div className='navContent'>
 					{this.props.children}
@@ -26,7 +27,8 @@ const Nav = {
 	},
 
 	section : createClass({
-		render : function(){
+		displayName : 'Nav.section',
+		render      : function(){
 			return <div className='navSection'>
 				{this.props.children}
 			</div>;
@@ -34,6 +36,7 @@ const Nav = {
 	}),
 
 	item : createClass({
+		displayName     : 'Nav.item',
 		getDefaultProps : function() {
 			return {
 				icon    : null,
@@ -69,24 +72,22 @@ const Nav = {
 	}),
 
 	dropdown : createClass({
+		displayName     : 'Nav.dropdown',
 		getDefaultProps : function() {
 			return {
 				trigger : 'hover'
 			};
 		},
-
 		getInitialState : function() {
 			return {
 				showDropdown : false
 			};
 		},
-
 		handleDropdown : function(show){
 			this.setState({
 				showDropdown : show
 			});
 		},
-
 		renderDropdown : function(dropdownChildren){
 			if(!this.state.showDropdown) return null;
 
@@ -96,7 +97,6 @@ const Nav = {
 				</div>
 			);
 		},
-
 		render : function () {
 			const dropdownChildren = React.Children.map(this.props.children, (child, i)=>{
 				// Ignore the first child

shared/naturalcrit/splitPane/splitPane.jsx

@@ -5,6 +5,7 @@ const _ = require('lodash');
 const cx = require('classnames');
 
 const SplitPane = createClass({
+	displayName     : 'SplitPane',
 	getDefaultProps : function() {
 		return {
 			storageKey   : 'naturalcrit-pane-split',
@@ -77,6 +78,7 @@ const SplitPane = createClass({
 });
 
 const Pane = createClass({
+	displayName     : 'Pane',
 	getDefaultProps : function() {
 		return {
 			width : null

tests/basic.test.js

@@ -1,7 +0,0 @@
-const test = require('pico-check');
-
-test('Just setting up a spot for future tests', (t)=>{
-	t.pass();
-});
-
-module.exports = test;

tests/markdown/basic.test.js

@@ -0,0 +1,15 @@
+/* eslint-disable max-lines */
+
+const Markdown = require('naturalcrit/markdown.js');
+
+test('Escapes <script> tag', function() {
+	const source = '<script></script>';
+	const rendered = Markdown.render(source);
+	expect(rendered).toMatch('&lt;script&gt;&lt;/script&gt;');
+});
+
+test('Processes the markdown within an HTML block if its just a class wrapper', function() {
+	const source = '<div>*Bold text*</div>';
+	const rendered = Markdown.render(source);
+	expect(rendered).toBe('<div> <p><em>Bold text</em></p>\n </div>');
+});

tests/markdown/mustache-span.test.js

@@ -0,0 +1,128 @@
+/* eslint-disable max-lines */
+
+const Markdown = require('naturalcrit/markdown.js');
+
+test('Renders a mustache span with text only', function() {
+	const source = '{{ text}}';
+	const rendered = Markdown.render(source);
+	expect(rendered).toBe('<span class="inline-block ">text</span>');
+});
+
+test('Renders a mustache span with text only, but with spaces', function() {
+	const source = '{{ this is a text}}';
+	const rendered = Markdown.render(source);
+	expect(rendered).toBe('<span class="inline-block ">this is a text</span>');
+});
+
+test('Renders an empty mustache span', function() {
+	const source = '{{}}';
+	const rendered = Markdown.render(source);
+	expect(rendered).toBe('<span class="inline-block "></span>');
+});
+
+test('Renders a mustache span with just a space', function() {
+	const source = '{{ }}';
+	const rendered = Markdown.render(source);
+	expect(rendered).toBe('<span class="inline-block "></span>');
+});
+
+test('Renders a mustache span with a few spaces only', function() {
+	const source = '{{     }}';
+	const rendered = Markdown.render(source);
+	expect(rendered).toBe('<span class="inline-block "></span>');
+});
+
+test('Renders a mustache span with text and class', function() {
+	const source = '{{my-class text}}';
+	const rendered = Markdown.render(source);
+	// FIXME: why do we have those two extra spaces after closing "?
+	expect(rendered).toBe('<span class="inline-block my-class"  >text</span>');
+});
+
+test('Renders a mustache span with text and two classes', function() {
+	const source = '{{my-class,my-class2 text}}';
+	const rendered = Markdown.render(source);
+	// FIXME: why do we have those two extra spaces after closing "?
+	expect(rendered).toBe('<span class="inline-block my-class my-class2"  >text</span>');
+});
+
+test('Renders a mustache span with text with spaces and class', function() {
+	const source = '{{my-class this is a text}}';
+	const rendered = Markdown.render(source);
+	// FIXME: why do we have those two extra spaces after closing "?
+	expect(rendered).toBe('<span class="inline-block my-class"  >this is a text</span>');
+});
+
+test('Renders a mustache span with text and id', function() {
+	const source = '{{#my-span text}}';
+	const rendered = Markdown.render(source);
+	// FIXME: why do we have that one extra space after closing "?
+	expect(rendered).toBe('<span class="inline-block " id="my-span" >text</span>');
+});
+
+test('Renders a mustache span with text and two ids', function() {
+	const source = '{{#my-span,#my-favorite-span text}}';
+	const rendered = Markdown.render(source);
+	// FIXME: do we need to report an error here somehow?
+	expect(rendered).toBe('<span class="inline-block " id="my-span" >text</span>');
+});
+
+test('Renders a mustache span with text and css property', function() {
+	const source = '{{color:red text}}';
+	const rendered = Markdown.render(source);
+	expect(rendered).toBe('<span class="inline-block "  style="color:red;">text</span>');
+});
+
+test('Renders a mustache span with text and two css properties', function() {
+	const source = '{{color:red,padding:5px text}}';
+	const rendered = Markdown.render(source);
+	expect(rendered).toBe('<span class="inline-block "  style="color:red; padding:5px;">text</span>');
+});
+
+test('Renders a mustache span with text and css property which contains quotes', function() {
+	const source = '{{font:"trebuchet ms" text}}';
+	const rendered = Markdown.render(source);
+	// FIXME: is it correct to remove quotes surrounding css property value?
+	expect(rendered).toBe('<span class="inline-block "  style="font:trebuchet ms;">text</span>');
+});
+
+test('Renders a mustache span with text and two css properties which contains quotes', function() {
+	const source = '{{font:"trebuchet ms",padding:"5px 10px" text}}';
+	const rendered = Markdown.render(source);
+	expect(rendered).toBe('<span class="inline-block "  style="font:trebuchet ms; padding:5px 10px;">text</span>');
+});
+
+
+test('Renders a mustache span with text with quotes and css property which contains quotes', function() {
+	const source = '{{font:"trebuchet ms" text "with quotes"}}';
+	const rendered = Markdown.render(source);
+	expect(rendered).toBe('<span class="inline-block "  style="font:trebuchet ms;">text “with quotes”</span>');
+});
+
+test('Renders a mustache span with text, id, class and a couple of css properties', function() {
+	const source = '{{pen,#author,color:orange,font-family:"trebuchet ms" text}}';
+	const rendered = Markdown.render(source);
+	expect(rendered).toBe('<span class="inline-block pen" id="author" style="color:orange; font-family:trebuchet ms;">text</span>');
+});
+
+// TODO: add tests for ID with accordance to CSS spec:
+//
+// From https://drafts.csswg.org/selectors/#id-selectors:
+//
+// > An ID selector consists of a “number sign” (U+0023, #) immediately followed by the ID value, which must be a CSS identifier.
+//
+// From: https://www.w3.org/TR/CSS21/syndata.html#value-def-identifier:
+//
+// > In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9]
+// > and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_);
+// > they cannot start with a digit, two hyphens, or a hyphen followed by a digit.
+// > Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item).
+// > For instance, the identifier "B&W?" may be written as "B\&W\?" or "B\26 W\3F".
+// > Note that Unicode is code-by-code equivalent to ISO 10646 (see [UNICODE] and [ISO10646]).
+
+// TODO: add tests for class with accordance to CSS spec:
+//
+// From: https://drafts.csswg.org/selectors/#class-html:
+//
+// > The class selector is given as a full stop (. U+002E) immediately followed by an identifier.
+

tests/test.init.js

@@ -1 +0,0 @@
-//Set up configs and DB connectiosna nd what not in here