Add export extension test HTML pages for Cypress tests

for-tests/extensions/export/export-customTypes.html

@@ -0,0 +1,38 @@
+<script>
+  init({
+    title: 'Export Custom Types',
+    desc: 'Test exportTypes with multiple supported types.',
+    links: [
+      'bootstrap-table.min.css'
+    ],
+    scripts: [
+      'https://cdn.jsdelivr.net/npm/tableexport.jquery.plugin@1.29.0/tableExport.min.js',
+      'bootstrap-table.min.js',
+      'extensions/export/bootstrap-table-export.min.js'
+    ]
+  })
+</script>
+
+<table id="table">
+  <thead>
+    <tr>
+      <th data-field="id">ID</th>
+      <th data-field="name">Name</th>
+      <th data-field="price">Price</th>
+    </tr>
+  </thead>
+</table>
+
+<script>
+  function mounted () {
+    $('#table').bootstrapTable({
+      showExport: true,
+      exportTypes: ['json', 'xml', 'csv', 'txt', 'sql', 'excel'],
+      data: [
+        { id: 1, name: 'Item 1', price: '$1' },
+        { id: 2, name: 'Item 2', price: '$2' },
+        { id: 3, name: 'Item 3', price: '$3' }
+      ]
+    })
+  }
+</script>

for-tests/extensions/export/export-dataType-all.html

@@ -0,0 +1,41 @@
+<script>
+  init({
+    title: 'Export Data Type All',
+    desc: 'Test exportDataType=all with pagination.',
+    links: [
+      'bootstrap-table.min.css'
+    ],
+    scripts: [
+      'https://cdn.jsdelivr.net/npm/tableexport.jquery.plugin@1.29.0/tableExport.min.js',
+      'bootstrap-table.min.js',
+      'extensions/export/bootstrap-table-export.min.js'
+    ]
+  })
+</script>
+
+<table id="table">
+  <thead>
+    <tr>
+      <th data-field="id">ID</th>
+      <th data-field="name">Name</th>
+      <th data-field="price">Price</th>
+    </tr>
+  </thead>
+</table>
+
+<script>
+  function mounted () {
+    const data = []
+
+    for (let i = 1; i <= 50; i++) {
+      data.push({ id: i, name: `Item ${i}`, price: `$${i}` })
+    }
+    $('#table').bootstrapTable({
+      showExport: true,
+      exportDataType: 'all',
+      pagination: true,
+      pageSize: 10,
+      data
+    })
+  }
+</script>

for-tests/extensions/export/export-dataType-selected.html

@@ -0,0 +1,39 @@
+<script>
+  init({
+    title: 'Export Data Type Selected',
+    desc: 'Test exportDataType=selected with checkbox selection.',
+    links: [
+      'bootstrap-table.min.css'
+    ],
+    scripts: [
+      'https://cdn.jsdelivr.net/npm/tableexport.jquery.plugin@1.29.0/tableExport.min.js',
+      'bootstrap-table.min.js',
+      'extensions/export/bootstrap-table-export.min.js'
+    ]
+  })
+</script>
+
+<table id="table">
+  <thead>
+    <tr>
+      <th data-field="state" data-checkbox="true"></th>
+      <th data-field="id">ID</th>
+      <th data-field="name">Name</th>
+      <th data-field="price">Price</th>
+    </tr>
+  </thead>
+</table>
+
+<script>
+  function mounted () {
+    $('#table').bootstrapTable({
+      showExport: true,
+      exportDataType: 'selected',
+      data: [
+        { id: 1, name: 'Item 1', price: '$1', state: false },
+        { id: 2, name: 'Item 2', price: '$2', state: false },
+        { id: 3, name: 'Item 3', price: '$3', state: false }
+      ]
+    })
+  }
+</script>

for-tests/extensions/export/export-events.html

@@ -0,0 +1,44 @@
+<script>
+  init({
+    title: 'Export Events',
+    desc: 'Test export-started and export-saved events.',
+    links: [
+      'bootstrap-table.min.css'
+    ],
+    scripts: [
+      'https://cdn.jsdelivr.net/npm/tableexport.jquery.plugin@1.29.0/tableExport.min.js',
+      'bootstrap-table.min.js',
+      'extensions/export/bootstrap-table-export.min.js'
+    ]
+  })
+</script>
+
+<table id="table">
+  <thead>
+    <tr>
+      <th data-field="id">ID</th>
+      <th data-field="name">Name</th>
+      <th data-field="price">Price</th>
+    </tr>
+  </thead>
+</table>
+
+<script>
+  function mounted () {
+    $('#table').bootstrapTable({
+      showExport: true,
+      data: [
+        { id: 1, name: 'Item 1', price: '$1' },
+        { id: 2, name: 'Item 2', price: '$2' }
+      ]
+    })
+
+    $('#table').on('export-started.bs.table', function () {
+      window._exportStarted = true
+    })
+    $('#table').on('export-saved.bs.table', function (e, data) {
+      window._exportSaved = true
+      window._exportedData = data
+    })
+  }
+</script>

for-tests/extensions/export/export-fileName-function.html

@@ -0,0 +1,41 @@
+<script>
+  init({
+    title: 'Export fileName Function',
+    desc: 'Test exportOptions.fileName as function.',
+    links: [
+      'bootstrap-table.min.css'
+    ],
+    scripts: [
+      'https://cdn.jsdelivr.net/npm/tableexport.jquery.plugin@1.29.0/tableExport.min.js',
+      'bootstrap-table.min.js',
+      'extensions/export/bootstrap-table-export.min.js'
+    ]
+  })
+</script>
+
+<table id="table">
+  <thead>
+    <tr>
+      <th data-field="id">ID</th>
+      <th data-field="name">Name</th>
+      <th data-field="price">Price</th>
+    </tr>
+  </thead>
+</table>
+
+<script>
+  function mounted () {
+    $('#table').bootstrapTable({
+      showExport: true,
+      exportOptions: {
+        fileName () {
+          return 'custom-export-name'
+        }
+      },
+      data: [
+        { id: 1, name: 'Item 1', price: '$1' },
+        { id: 2, name: 'Item 2', price: '$2' }
+      ]
+    })
+  }
+</script>

for-tests/extensions/export/export-footer.html

@@ -0,0 +1,47 @@
+<script>
+  init({
+    title: 'Export Footer',
+    desc: 'Test exportFooter=true to include table footer in export.',
+    links: [
+      'bootstrap-table.min.css'
+    ],
+    scripts: [
+      'https://cdn.jsdelivr.net/npm/tableexport.jquery.plugin@1.29.0/tableExport.min.js',
+      'bootstrap-table.min.js',
+      'extensions/export/bootstrap-table-export.min.js'
+    ]
+  })
+</script>
+
+<table id="table">
+  <thead>
+    <tr>
+      <th data-field="id">ID</th>
+      <th data-field="name">Name</th>
+      <th data-field="price">Price</th>
+    </tr>
+  </thead>
+  <tfoot>
+    <tr>
+      <td>Total</td>
+      <td></td>
+      <td>$6</td>
+    </tr>
+  </tfoot>
+</table>
+
+<script>
+  function mounted () {
+    $('#table').bootstrapTable({
+      showExport: true,
+      showFooter: true,
+      exportFooter: true,
+      height: 400,
+      data: [
+        { id: 1, name: 'Item 1', price: '$1' },
+        { id: 2, name: 'Item 2', price: '$2' },
+        { id: 3, name: 'Item 3', price: '$3' }
+      ]
+    })
+  }
+</script>

for-tests/extensions/export/export-forceExport.html

@@ -0,0 +1,38 @@
+<script>
+  init({
+    title: 'Export forceExport',
+    desc: 'Test forceExport column option to export hidden columns.',
+    links: [
+      'bootstrap-table.min.css'
+    ],
+    scripts: [
+      'https://cdn.jsdelivr.net/npm/tableexport.jquery.plugin@1.29.0/tableExport.min.js',
+      'bootstrap-table.min.js',
+      'extensions/export/bootstrap-table-export.min.js'
+    ]
+  })
+</script>
+
+<table id="table">
+  <thead>
+    <tr>
+      <th data-field="id">ID</th>
+      <th data-field="name">Name</th>
+      <th data-field="price">Price</th>
+      <th data-field="secret" data-visible="false" data-force-export="true">Secret</th>
+    </tr>
+  </thead>
+</table>
+
+<script>
+  function mounted () {
+    $('#table').bootstrapTable({
+      showExport: true,
+      data: [
+        { id: 1, name: 'Item 1', price: '$1', secret: 's1' },
+        { id: 2, name: 'Item 2', price: '$2', secret: 's2' },
+        { id: 3, name: 'Item 3', price: '$3', secret: 's3' }
+      ]
+    })
+  }
+</script>

for-tests/extensions/export/export-forceHide.html

@@ -0,0 +1,38 @@
+<script>
+  init({
+    title: 'Export forceHide',
+    desc: 'Test forceHide column option to hide columns from export.',
+    links: [
+      'bootstrap-table.min.css'
+    ],
+    scripts: [
+      'https://cdn.jsdelivr.net/npm/tableexport.jquery.plugin@1.29.0/tableExport.min.js',
+      'bootstrap-table.min.js',
+      'extensions/export/bootstrap-table-export.min.js'
+    ]
+  })
+</script>
+
+<table id="table">
+  <thead>
+    <tr>
+      <th data-field="id">ID</th>
+      <th data-field="name">Name</th>
+      <th data-field="price">Price</th>
+      <th data-field="icon" data-force-hide="true">Icon</th>
+    </tr>
+  </thead>
+</table>
+
+<script>
+  function mounted () {
+    $('#table').bootstrapTable({
+      showExport: true,
+      data: [
+        { id: 1, name: 'Item 1', price: '$1', icon: '⭐' },
+        { id: 2, name: 'Item 2', price: '$2', icon: '🔥' },
+        { id: 3, name: 'Item 3', price: '$3', icon: '✅' }
+      ]
+    })
+  }
+</script>

for-tests/extensions/export/export-method.html

@@ -0,0 +1,41 @@
+<script>
+  init({
+    title: 'Export Method',
+    desc: 'Test exportTable() method for programmatic export.',
+    links: [
+      'bootstrap-table.min.css'
+    ],
+    scripts: [
+      'https://cdn.jsdelivr.net/npm/tableexport.jquery.plugin@1.29.0/tableExport.min.js',
+      'bootstrap-table.min.js',
+      'extensions/export/bootstrap-table-export.min.js'
+    ]
+  })
+</script>
+
+<table id="table">
+  <thead>
+    <tr>
+      <th data-field="id">ID</th>
+      <th data-field="name">Name</th>
+      <th data-field="price">Price</th>
+    </tr>
+  </thead>
+</table>
+
+<button id="btn-export" class="btn btn-secondary">Export CSV</button>
+
+<script>
+  function mounted () {
+    $('#table').bootstrapTable({
+      data: [
+        { id: 1, name: 'Item 1', price: '$1' },
+        { id: 2, name: 'Item 2', price: '$2' }
+      ]
+    })
+
+    $('#btn-export').click(function () {
+      $('#table').bootstrapTable('exportTable', { type: 'csv' })
+    })
+  }
+</script>