外部 JavaScript 扩展
外部 JavaScript 和 CSS 文件可用于扩展 Codebeamer 功能和自定义用户界面。
可以使用扩展对以下页面进行扩展和自定义：
• 跟踪器视图。
• 跟踪器项视图。
• 引用选择器。
• 报告。
 |
脚本使用的 UI 模型可能在任何版本 (包括重要修补程序集) 中发生更改，恕不另行通知。由将脚本与客户共享的合作伙伴负责维护和确认脚本与特定版本的兼容性。
|
使用外部脚本
在加载和使用自定义脚本文件之前，这些文件需要满足以下要求：
• 在启动 Codebeamer 之前，脚本文件必须位于 <codebeamer Installation dir>/repository/config/customization/js 中。如果 Codebeamer 正在运行，则在重新启动 Codebeamer 之前，不会处理对文件夹或脚本文件所做的变更。
• 自定义脚本必须封装在 jQuery load 函数中。
• externalScripts 必须在“应用程序配置”中启用。
封装外部脚本
为使 DOM 准备就绪，外部脚本必须通过以下方式封装在 jQuery load 函数中：
$(window).on('load', function() {
...
<external script>
...
});
...
<external script>
...
});
应用程序配置
可通过添加以下部分，在 > 菜单中启用或禁用将外部脚本加载到不同 Codebeamer 页面：
...
"externalScripts" : {
"enabled" : true
}
...
"externalScripts" : {
"enabled" : true
}
...
默认值为 false。
有关应用程序配置的详情，请参阅：应用程序配置。
示例
鉴于之前在“应用程序配置”中应用了相应设置，本示例将逐步说明如何使用脚本自定义和扩展 Codebeamer 功能和用户界面。在本示例中， > 页面的页面标题颜色将变为红色，单击后将变回白色。
1. 停止 Codebeamer。
2. 下载以下文件：
3. 在启动 Codebeamer 前将文件复制到 <codebeamer Installation dir>/repository/config/customization/js。
4. 启动 Codebeamer。
5. 转至 > 页面。
6. 单击页面标题：“新建报告”，该标题应变为红色。
7. 再次单击标题，该标题将变回白色。
8. 控制台日志应显示以下消息：external script - title clicked。
9. 包含相同文本的消息也会记录在 Codebeamer 日志中。
文件内容
$(window).on('load', function() {
const msg = "external script - title clicked";
$( ".page-title" ).click(
function() {
$(this).toggleClass( "title-red" );
console.log(msg);
codebeamer.MessageLogger.error(msg);
}
);
});
const msg = "external script - title clicked";
$( ".page-title" ).click(
function() {
$(this).toggleClass( "title-red" );
console.log(msg);
codebeamer.MessageLogger.error(msg);
}
);
});
.title-red {
color: red !important;
}
color: red !important;
}