diff --git a/editors/demo/src/Editors.js b/editors/demo/src/Editors.js
index 1e839e3d33a7e73e494ec5a4903e8c7fa669e16d..166168897656c1d73e46585d9f7a08e372190219 100644
--- a/editors/demo/src/Editors.js
+++ b/editors/demo/src/Editors.js
@@ -70,7 +70,7 @@ const Editors = () => {
       case 'ncbi':
         return <NCBI />;
       default:
-        return <HHMI />;
+        return <Editoria />;
     }
   };
 
diff --git a/editors/demo/src/NCBI/NCBI.js b/editors/demo/src/NCBI/NCBI.js
index e65630385deb77d38d7489ef5acbddaf27d5177c..dcae24b1a3f83793c1e9f2f4800cbbd201bc90c0 100644
--- a/editors/demo/src/NCBI/NCBI.js
+++ b/editors/demo/src/NCBI/NCBI.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useCallback, useState } from 'react';
 
 import { Wax } from 'wax-prosemirror-core';
 import styled from 'styled-components';
@@ -35,6 +35,14 @@ const TitleEditor = styled.div`
   width: 80px;
 `;
 
+const TitleEditorExport = styled.div`
+  background: #fff;
+  height: 20px;
+  position: relative;
+  top: 2px;
+  width: 120px;
+`;
+
 const ThirdEditorWrapper = styled.div`
   margin-top: 30px;
   display: flex;
@@ -48,11 +56,20 @@ const ThirdEditor = styled.div`
 `;
 
 const ContentArea = styled.div`
-  height: 250px;
+  height: 200px;
   border: 1px solid black;
+  overflow-y: auto;
 `;
 
+let a = '';
+
 const Ncbi = () => {
+  const [content, setContent] = useState('');
+
+  const getContent = source => {
+    setContent(savedContent => `${savedContent} ${source}`);
+  };
+
   return (
     <Wrapper>
       <FirstTwoWrapper>
@@ -78,13 +95,13 @@ const Ncbi = () => {
       </FirstTwoWrapper>
       <ThirdEditorWrapper>
         <ThirdEditor>
-          <ContentArea></ContentArea>
+          <TitleEditorExport>Export On Enter</TitleEditorExport>
+          <ContentArea dangerouslySetInnerHTML={{ __html: content }} />
           <Wax
-            config={configEnter}
+            config={configEnter(getContent)}
             autoFocus
-            value=""
             layout={EnterLayout}
-            placeholder="Start Typing ..."
+            placeholder="Start Typing and press enter..."
           />
         </ThirdEditor>
       </ThirdEditorWrapper>
diff --git a/editors/demo/src/NCBI/config/configEnter.js b/editors/demo/src/NCBI/config/configEnter.js
index bed6a3457a96a9595e1aa86a34e207f101961736..2bf14ef69232d33be7016a124206222d0a894957 100644
--- a/editors/demo/src/NCBI/config/configEnter.js
+++ b/editors/demo/src/NCBI/config/configEnter.js
@@ -10,11 +10,13 @@ import {
   EnterService,
 } from 'wax-prosemirror-services';
 
-const getContentOnEnter = source => {
-  console.log('editor content', source);
-};
+import invisibles, {
+  space,
+  hardBreak,
+  paragraph,
+} from '@guardian/prosemirror-invisibles';
 
-const config = {
+const configEnter = getContent => ({
   MenuService: [
     {
       templateArea: 'topBar',
@@ -36,8 +38,12 @@ const config = {
   ShortCutsService: {},
   LinkService: {},
   SchemaService: DefaultSchema,
-  PmPlugins: [],
-  EnterService: { getContentOnEnter },
+  PmPlugins: [invisibles([hardBreak()])],
+  EnterService: {
+    getContentOnEnter: source => {
+      getContent(source);
+    },
+  },
 
   services: [
     new EnterService(),
@@ -49,6 +55,6 @@ const config = {
     new ListsService(),
     new BaseToolGroupService(),
   ],
-};
+});
 
-export default config;
+export default configEnter;
diff --git a/editors/demo/src/NCBI/layout/EnterLayout.js b/editors/demo/src/NCBI/layout/EnterLayout.js
index 69052ec5f0eb058c7beab1201785f0f74204fc10..f87166de4b8ca74a43635caeb42206e16b193250 100644
--- a/editors/demo/src/NCBI/layout/EnterLayout.js
+++ b/editors/demo/src/NCBI/layout/EnterLayout.js
@@ -62,6 +62,7 @@ const EditorContainer = styled.div`
 
   .ProseMirror {
     border-top: none;
+    line-height: 1.6em;
     margin-right: ${grid(1)};
     padding: ${grid(1)};
   }