diff --git a/bt5/erp5_officejs_ui_test/PathTemplateItem/portal_tests/officejs_ui_media_player_zuite/testOfficeJSMediaPlayerReuseGadget.xml b/bt5/erp5_officejs_ui_test/PathTemplateItem/portal_tests/officejs_ui_media_player_zuite/testOfficeJSMediaPlayerReuseGadget.xml
new file mode 100644
index 0000000000000000000000000000000000000000..50a43f9a47b0b5b85b8fe1590350a0df70867127
--- /dev/null
+++ b/bt5/erp5_officejs_ui_test/PathTemplateItem/portal_tests/officejs_ui_media_player_zuite/testOfficeJSMediaPlayerReuseGadget.xml
@@ -0,0 +1,58 @@
+<?xml version="1.0"?>
+<ZopeData>
+  <record id="1" aka="AAAAAAAAAAE=">
+    <pickle>
+      <global name="ZopePageTemplate" module="Products.PageTemplates.ZopePageTemplate"/>
+    </pickle>
+    <pickle>
+      <dictionary>
+        <item>
+            <key> <string>_bind_names</string> </key>
+            <value>
+              <object>
+                <klass>
+                  <global name="NameAssignments" module="Shared.DC.Scripts.Bindings"/>
+                </klass>
+                <tuple/>
+                <state>
+                  <dictionary>
+                    <item>
+                        <key> <string>_asgns</string> </key>
+                        <value>
+                          <dictionary>
+                            <item>
+                                <key> <string>name_subpath</string> </key>
+                                <value> <string>traverse_subpath</string> </value>
+                            </item>
+                          </dictionary>
+                        </value>
+                    </item>
+                  </dictionary>
+                </state>
+              </object>
+            </value>
+        </item>
+        <item>
+            <key> <string>content_type</string> </key>
+            <value> <string>text/html</string> </value>
+        </item>
+        <item>
+            <key> <string>expand</string> </key>
+            <value> <int>0</int> </value>
+        </item>
+        <item>
+            <key> <string>id</string> </key>
+            <value> <string>testOfficeJSMediaPlayerReuseGadget</string> </value>
+        </item>
+        <item>
+            <key> <string>output_encoding</string> </key>
+            <value> <string>utf-8</string> </value>
+        </item>
+        <item>
+            <key> <string>title</string> </key>
+            <value> <unicode></unicode> </value>
+        </item>
+      </dictionary>
+    </pickle>
+  </record>
+</ZopeData>
diff --git a/bt5/erp5_officejs_ui_test/PathTemplateItem/portal_tests/officejs_ui_media_player_zuite/testOfficeJSMediaPlayerReuseGadget.zpt b/bt5/erp5_officejs_ui_test/PathTemplateItem/portal_tests/officejs_ui_media_player_zuite/testOfficeJSMediaPlayerReuseGadget.zpt
new file mode 100644
index 0000000000000000000000000000000000000000..abc3734f0d41d44a80502ea2516660458f670358
--- /dev/null
+++ b/bt5/erp5_officejs_ui_test/PathTemplateItem/portal_tests/officejs_ui_media_player_zuite/testOfficeJSMediaPlayerReuseGadget.zpt
@@ -0,0 +1,203 @@
+<html xmlns:tal="http://xml.zope.org/namespaces/tal"
+      xmlns:metal="http://xml.zope.org/namespaces/metal">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+<title>Test Media Player UI</title>
+</head>
+<body>
+<table cellpadding="1" cellspacing="1" border="1">
+<thead>
+  <tr><td rowspan="1" colspan="3">Test OfficeJS UI</td></tr>
+</thead>
+<tbody>
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />
+<!-- Initialize -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/web_site_module/officejs_media_player/</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n='Storages']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n='Storages']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>link=Local is Enough</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>link=Local is Enough</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>link=Add</td>
+  <td></td>
+</tr>
+<tr>
+  <td>open</td>
+  <td>${base_url}/web_page_module/Zuite_waitForActivities</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertTextPresent</td>
+  <td>Done.</td>
+  <td></td>
+</tr>
+
+<!-- Create entry -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/web_site_module/officejs_media_player/app/#/?page=ojs_add_document&editable=true</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@class='error']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//button[@class='error']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>open</td>
+  <td>${base_url}/web_page_module/Zuite_waitForActivities</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertTextPresent</td>
+  <td>Done.</td>
+  <td></td>
+</tr>
+<tr>
+  <td>open</td>
+  <td>${base_url}/web_site_module/officejs_media_player/app/#/?page=ojs_add_document&editable=true</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@class='error']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//button[@class='error']</td>
+  <td></td>
+</tr>
+
+<!-- Modify title -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/web_site_module/officejs_media_player/</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n='Add']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n='Title']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@class='ui-link']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//a[@class='ui-link']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@class='error']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//button[@class='error']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@id='title']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>type</td>
+  <td>//input[@id='title']</td>
+  <td>1</td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@data-i18n='Save']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//button[@data-i18n='Save']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//div[@class='audioplayer']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>getEval</td>
+  <td>window.document.querySelector('.audioplayer').classList.add('test')</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//div[contains(@class, 'audioplayer test')]</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n="Next"]</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n="Next"]</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Untitled Document</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@class='error']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//button[@class='error']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>verifyElementPresent</td>
+  <td>//div[contains(@class, 'audioplayer test')]</td>
+  <td></td>
+</tr>
+</tbody>
+</table>
+</body>
+</html>
\ No newline at end of file