m('div', {
  'data-foo': 'bar'
}

generates

attrs: {
  data-foo: 'bar'
}

Which breaks...

EDIT: in the meantime the workaround is to do something like

var a = {};
a['data-foo'] = 'bar';
m('div', a);

For some reason it only does the first one, which is less useful than it should be.

So #19 can finally die a real, proper death.

If we see a call like m("<selector>", [ ... ].map(...)) that should be convertable (since Array.prototype methods all return another array).

I'm trying to use this as a browserify transform along with babelify but I'm running into some issues with ES6 imports.

This example works as expected:

const m = require('mithril')
const tags = m('.hello', m('a.world', {href: '#'}, 'Hello!'))
console.log(tags)

But transforms aren't applied for this example:

import m from 'mithril'
const tags = m('.hello', m('a.world', {href: '#'}, 'Hello!'))
console.log(tags)

CallExpression[callee.name="m"] looks promising.

https://www.npmjs.com/package/esquery

Much like the just-added support for knowing that m.trust() is optimizable we should know that m.component() is optimizable as well. Not gonna get a ton of wins w/ that one, but should be pretty easy to add.

Due to 7bc837f quoted properties like m(".fooga", { "booga" : true }) are being optimized out as:

{
    tag : "div",
    attrs : {
        "class" : "fooga",
        "undefined" : true
    }
}

This is obviously incorrect.

Would be neat to see stats output,

converted / total = % converted

for each file/thing being processed. Would need to be an option you can plumb through browserify/API/CLI.

Create an empty file empty.js

$ browserify --version
5.11.0

$ browserify empty.js
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){

},{}]},{},[1]);

$ browserify -t mithril-objectify empty.js
/Users/sh/Work/tutory/webapp/node_modules/mithril-objectify/node_modules/falafel/node_modules/acorn/dist/acorn.js:1748
  throw err;
  ^

SyntaxError: Invalid regular expression flag (1:1)
    at Parser.pp.raise (/Users/sh/Work/tutory/webapp/node_modules/mithril-objectify/node_modules/falafel/node_modules/acorn/dist/acorn.js:1745:13)
    at Parser.pp.readRegexp (/Users/sh/Work/tutory/webapp/node_modules/mithril-objectify/node_modules/falafel/node_modules/acorn/dist/acorn.js:3527:38)
    at Parser.pp.readToken_slash (/Users/sh/Work/tutory/webapp/node_modules/mithril-objectify/node_modules/falafel/node_modules/acorn/dist/acorn.js:3318:28)
    at Parser.pp.getTokenFromCode (/Users/sh/Work/tutory/webapp/node_modules/mithril-objectify/node_modules/falafel/node_modules/acorn/dist/acorn.js:3456:19)
    at Parser.pp.readToken (/Users/sh/Work/tutory/webapp/node_modules/mithril-objectify/node_modules/falafel/node_modules/acorn/dist/acorn.js:3190:15)
    at Parser.pp.nextToken (/Users/sh/Work/tutory/webapp/node_modules/mithril-objectify/node_modules/falafel/node_modules/acorn/dist/acorn.js:3182:71)
    at parse (/Users/sh/Work/tutory/webapp/node_modules/mithril-objectify/node_modules/falafel/node_modules/acorn/dist/acorn.js:100:5)
    at module.exports (/Users/sh/Work/tutory/webapp/node_modules/mithril-objectify/node_modules/falafel/index.js:22:15)
    at transform (/Users/sh/Work/tutory/webapp/node_modules/mithril-objectify/index.js:9:12)
    at nr (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:230:23)

https://travis-ci.org/tivac/crucible/builds/163572082

Looks like the usage of require("babel-core") is no good, probably need to get passed a babel instance and then pass it around or something annoying instead.

Hello, I noticed a weird behaviour in my app after running mopt, which seems to involve classes determined by ternary operators. Here's a quick example to reproduce the issue:

Source code:

const root = document.body;
const states = [true, false, null];
const state = states[Math.floor(Math.random() * states.length)];

m.render(root, m('span', {
        className: state === true ? 'text-success' : state === false ? 'text-danger' : 'text-muted'
}, 'status'));

Transformed result:

var root = document.body;
var states = [true, false, null];
var state = states[Math.floor(Math.random() * states.length)];

m.render(root, m.vnode('span', undefined, undefined, undefined, 'status', undefined));

To help automate a better changelog/commit messages across-the-board.

remy/clite@fc36b01

Is a reasonable example of a starting point.

Hi tivac,
I had some issues running mithril-objectify via CLI in Windows.

First I had to install it globally via npm install -g mithril-objectify to make it being recognized as command (is there another way to run it only locally inside the project?).

Then to make it work I had to change the mithril-objectify.cmd content from:

"%~dp0\node_modules\mithril-objectify\bin\cli.js"   %*

to

@IF EXIST "%~dp0\node.exe" (
  "%~dp0\node.exe"  "%~dp0\node_modules\mithril-objectify\bin\cli.js" %*
) ELSE (
  node  "%~dp0\node_modules\mithril-objectify\bin\cli.js" %*
)

Now it's working like a charm, I hope this could be useful.

I have the following component which works without mopt enabled, but is broken with mopt:

const NEWEST = 'Newest first';
const VOTES = 'Most votes';
const SortToggle = {
    view({ attrs }) {
        return (
            m('.SortToggle',
                m('.SortToggle-option', { onclick() { attrs.sortBy(NEWEST); } }, NEWEST),
                m('.SortToggle-option', { onclick() { attrs.sortBy(MOST_VOTES); } }, MOST_VOTES)
            )
        );

    }
};

It works fine using mopt if I inline the string constants, like this:

const NEWEST = 'Newest first';
const VOTES = 'Most votes';
const SortToggle = {
    view({ attrs }) {
        return (
            m('.SortToggle',
                m('.SortToggle-option', { onclick() { attrs.sortBy(NEWEST); } }, 'Newest first'),
                m('.SortToggle-option', { onclick() { attrs.sortBy(MOST_VOTES); } }, 'Most votes')
            )
        );

    }
};

Hi Tivac.

Loved you module so far. Now as it requires babel to run not so much.

Would love allow to use it as plain browserify transform again.

https://github.com/millermedeiros/rocambole

rocambole.moonwalk() to traverse from leaves -> parent might allow us to find some extra optimizations since we'll have already transformed the children first.

I've run in a similar issue:
nwutils/nw-builder#75
I noticed that many files have Dos\Windows EOL while they should have UNIX EOL.

Community health files are stuff like CONTRIBUTING.md, FUNDING.yml, and so on, stuff that normally lives in .github, docs/, or the repo's root. I've added default files for everything on this list of supported file types except for a CONTRIBUTING.md file, as that process varies pretty greatly across repos. For issue templates, there's two templates: one for bugs and one for feature requests. The pull request template and issue templates are each derived from the core project's own core templates but with core-specific stuff omitted.

No action is required on your part, but you may wish to customize these appropriately and/or take other related action in light of this like adding/removing issue templates.

If you have any questions, comments, or concerns, please file an issue and I'd be more than willing to address them.

m(".preview-container", loadingInfo.order.map(...))

should be optimized, but doesn't look like that's happening atm.

Version: 5.0.2

code:

m(
    "p",
    {
        className: `mithril-Pager-page-arrow ${vnode.attrs.currentPage > 1 ? "" : "mithril-Pager-page-arrow--disabled"}`
    },
    "test"
)

In the output className is not included.

For repo: https://github.com/gyandeeps/mithril-hn
File: https://github.com/gyandeeps/mithril-hn/blob/82879b862da659491d441837f9953f40337ed033/src/js/components/Pager.js

Notes:

• If I don't use template string then it works.
  className: "mithril-Pager-page-arrow " + (vnode.attrs.currentPage > 1 ? "" : "mithril-Pager-page-arrow--disabled")