docs: document the custom block processor feature

Author: JessicaSachs

README.md

@@ -63,12 +63,73 @@ vue-jest compiles the script and template of SFCs into a JavaScript file that Je
 - **typescript** (`lang="ts"`, `lang="typescript"`)
 - **coffeescript** (`lang="coffee"`, `lang="coffeescript"`)
 
+### Natively Supported Vue custom blocks
+
+- **vue-i18n** (`<i18n lang="json">`, `<i18n lang="yaml">`)
+
 ### Global Jest options
 
 You can change the behavior of `vue-jest` by using `jest.globals`.
 
+#### Supporting custom blocks
+
+A great feature of the Vue SFC compiler is that it can support custom blocks. You might want to use those blocks in your tests. To render out custom blocks for testing purposes, you'll need to write a transformer. Once you have your transformer, you'll add an entry to vue-jest's transform map. This is how [vue-i18n's](https://github.com/kazupon/vue-i18n) `<i18n>` custom blocks are supported in unit tests.
+
+A `package.json` Example
+
+```json
+{
+  "jest": {
+    "moduleFileExtensions": ["js", "json", "vue"],
+    "transform": {
+      "^.+\\.js$": "babel-jest",
+      "^.+\\.vue$": "vue-jest"
+    },
+    "globals": {
+      "vue-jest": {
+        "transform": {
+          "your-custom-block": "./custom-block-processor.js"
+        }
+      }
+    }
+  }
+}
+```
+
 > _Tip:_ Need programmatic configuration? Use the [--config](https://jestjs.io/docs/en/cli.html#config-path) option in Jest CLI, and export a `.js` file
 
+A `jest.config.js` Example - If you're using a dedicated configuration file like you can reference and require your processor in the config file instead of using a file reference.
+
+```js
+module.exports = {
+  globals: {
+    'vue-jest': {
+      transform: {
+        'your-custom-block': require('./custom-block-processor')
+      }
+    }
+  }
+}
+```
+
+#### Writing a processor
+
+Processors must return an object with a "process" method, like so...
+
+```js
+module.exports = {
+  /**
+   * Process the content inside of a custom block and prepare it for execution in a testing environment
+   * @param {SFCCustomBlock[]} blocks All of the blocks matching your type, returned from `@vue/component-compiler-utils`
+   * @param {string} vueOptionsNamespace The internal namespace for a component's Vue Options in vue-jest
+   * @param {string} filename The SFC file being processed
+   * @param {Object} config The full Jest config
+   * @returns {string} The code to be output after processing all of the blocks matched by this type
+   */
+  process(blocks, vueOptionsNamepsace, filename, config) {}
+}
+```
+
 #### babelConfig
 
 Provide `babelConfig` in one of the following formats:

lib/process-custom-blocks.js

@@ -8,7 +8,7 @@ function applyTransformer(
   filename,
   config
 ) {
-  return transformer.process(blocks, vueOptionsNamespace, filename, config)
+  return transformer.process({ blocks, vueOptionsNamespace, filename, config })
 }
 
 function groupByType(acc, block) {

lib/transformers/i18n.js

@@ -39,7 +39,7 @@ function parseLanguageAndContent(block, filename) {
 }
 
 module.exports = {
-  process(blocks, vueOptionsNamespace, filename) {
+  process({ blocks, vueOptionsNamespace, filename }) {
     const base = `${vueOptionsNamespace}.${VUE_I18N_OPTION} = []`
     const codes = blocks.map(block => {
       if (block.type === 'i18n') {